Jquery 无刷新提交表单并轮换页面数据
演示地址:http://www.corange.cn/demo/3850/index.html
本例是用jquery.form.js form提交,action传递的
加了一个判断填写的项目是否填写
直接替换本页面ID
使用jquery.form.js
主要代码
<script src="../jquery.js"></script>
<script src="jquery.form.js"></script>
<script>
// prepare the form when the DOM is ready
$(document).ready(function() {
// bind form using ajaxForm
$('#htmlForm').ajaxForm({
beforeSubmit:checkForm,//提交前运行函数验证
// target identifies the element(s) to update with the server response
target: '#htmlExampleTarget',
// success identifies the function to invoke when the server response
// has been received; here we apply a fade-in effect to the new content
success: function() {
$('#message').attr({"value":""});//内容提交后清空表单
$('#htmlExampleTarget').fadeIn('slow');
}
});
function checkForm(){
if(document.htmlForm.bigclassid.value=="")
{
alert("Please choose product item");
document.htmlForm.bigclassid.focus();
$('#htmlForm').preventDefault();//阻止表单提交
}
}
});
</script>
</head>
<form id="htmlForm" action="ok.php" method="get" name="htmlForm">
<input id="bigclassid" name="bigclassid">
Message: <input type="text" name="message" value="" id="message"/>
<input type="submit" value="ok" />
</form>
<div id="htmlExampleTarget">
</div>
原文地址:http://www.corange.cn/archives/2012/08/3850.html