在做项目的过程中遇到要将form表单提交转为ajax方式提交,下面是我总结的如何把form表单提交无缝转为ajax方式提交的方法。将form元素的属性action、enctype、method去掉,添加id="form",form元素就变为
引入jquery库,点击【这里】下载
提交按钮增加 οnclick="add_ajax()" 并把 type="submit" 修改为 type="button"
例如:
把ajax代码放在页面最底部(不能放在jquery库之前)
function add_ajax(){
$.ajax({
type: "POST",
url: "/plus/diy.php",//提交到后台文件
data: $('#form').serialize(),//表单传值
success: function(data) {
//弹窗显示PHP返回的值
alert(data);
//以html的形式显示在指定id的元素里
$("#deok").html(data);
//提交后清除表单填写的值
$('#form')[0].reset();
//往input框里传值
$(this).val("");//清空上次input框里的数据
$("#deok").val(aaa["boxnum"]);//向input框里写入新数据
}
});
return false;
}
延伸阅读:当表单的属性设置为"disabled"时,提交表单时,select的值无法传递,需要提交前移除disabled属性,使用$("#role").removeAttr("disabled");
本文地址:dedecms不跳转(ajax)提交自定义表单的方法【简单粗暴】 https://www.shenqiu123.com/a/jianzhan/ercikaifa/5306.html