jquery表单应用
有必要获取表单内各input元素的数据，然后用ajax方法以POST方式提交给服务器。如果input元素有ID属性，假设是<input type=”text” name=”writer” id=”writer” />，可以这样获取：
var writervalue=$(”#writer”).val();
<input name=”writer” id=”writer” type=”text” value=”writer” />
<input type=”submit” name=”button” id=”button” value=”提交” />
先不考虑用submit提交表单，因为有jquery的Form插件可以近乎完美地完成表单的提交。这是个很强大的插件……
<script type=”text/javascript” src=”jquery.js” mce_src=”jquery.js”></script>
<script type=”text/javascript”>
$(document).ready(function(){ //DOM的onload事件处理函数
$(”#button”).click(function(){ //当按钮button被点击时的处理函数
postdata(); //button被点击时执行postdata函数
});
});
function postdata(){ //提交数据函数
$.ajax({ //调用jquery的ajax方法
type: “POST”, //设置ajax方法提交数据的形式
url: “ok.PHP”, //把数据提交到ok.PHP
data: “writer=”+$(”#writer”).val(), //输入框writer中的值作为提交的数据
success: function(msg){ //提交成功后的回调，msg变量是ok.PHP输出的内容。
alert(”数据提交成功”); //如果有必要，可以把msg变量的值显示到某个DIV元素中
}
});
}
</script>
大功告成！假如输入框很多，在ajax方法的data参数里可以这样表示：
data:”n1=&n2=&n3=…”
jquery的Form插件可以轻松而且不引发页面刷新地提交表单，所以这个插件被很多开发人员使用（插件需要在jquery库之后加载）。这个插件提供一个formToArray方法获得表单中所有元素的值的数组，可以这样做：
var data = $(”#myForm”).formToArray();
$.post( “ok.PHP”, data );
变量data事实上是个数组。变量通过jquery的post方法提交到ok.PHP。
看上去用post方法要比ajax方法省事。jquery的ajax方法是low-level（底层）处理机制，而post、get、方法则是higher-level（高层）处理机制，已经被封装好了的，更容易理解和使用。但也有缺点，就是不能返回更详细的信息，比如错误处理……
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
