在做项目的过程中遇到要将form表单提交转为ajax方式提交,下面是我总结的如何把form表单提交无缝转为ajax方式提交的方法。
将form元素的属性action、enctype、method去掉,添加id="form",form元素就变为<form id="form">
提交按钮增加onclick="add_ajax()"并把type="submit"修改为type="button"
例如:<input type="button" value="提交" onclick="add_ajax()" />
把ajax代码放在页面最底部(不能放在jquery库之前)
<script type="text/javascript">
function add_ajax(){
$.ajax({
type: "POST",
url: "/plus/diy.php",//提交到后台文件
data: $('#form').serialize(),//表单传值
success: function(data) {
alert(data);//弹窗显示PHP返回的值,如不需要显示,注释掉这行即可
$('#form')[0].reset();//提交后清除表单填写的值
}
});
return false;
}
</script>
延伸阅读:
当表单的属性设置为"disabled"时,提交表单时,select的值无法传递,需要提交前移除disabled属性,使用$("#role").removeAttr("disabled");即可(提交前移除id="role"的disabled属性)
免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。
评论(0)