首页 > Web开发 > 详细

ajax表单提交执行成功但是没有执行回调函数,并且post变get了

时间:2020-05-29 15:31:33      阅读:35      评论:0      收藏:0      [点我收藏+]

因为一时的疏忽,在写表单提交的时候写成了这样:

<form id="addEssaysForm">
                    
      <label for="essaysTitle">标题</label>
      <input type="text" class="form-control" name="essaysTitle" id="essaysTitle" placeholder="请输入标题">
                                                            
      <label>内容</label>
      <textarea class="form-control" name="essaysContent" rows="15" style="resize: none"></textarea>
                           
      <button id="addBtn">提交</button>
</form>


<script>
$("#addBtn").click(function () {
$.ajax({
type:"POST",
dataType:"json",
url:"add",
data: $(‘#addEssaysForm‘).serialize(),
success: function (data) {
console.log(data);
alert(data.msg);
},
error : function(result) {
alert("系统异常!"+result);
}
});
});

</script>

这样发现一直不走回调函数,而且提交的内容在地址栏显示出来了,明明使用的post提交的啊!

百度了好久,后来才发现是form表单这出了问题,平时很少写前端代码,犯了这样的错误。正确的写法应该是这样的:

<form id="addEssaysForm" onsubmit="return false" action="##" method="post">
                    
      <label for="essaysTitle">标题</label>
      <input type="text" class="form-control" name="essaysTitle" id="essaysTitle" placeholder="请输入标题">
                                                            
      <label>内容</label>
      <textarea class="form-control" name="essaysContent" rows="15" style="resize: none"></textarea>
                           
      <button id="addBtn">提交</button>
</form>

<script>
$("#addBtn").click(function () {
$.ajax({
type:"POST",
dataType:"json",
url:"add",
data: $(‘#addEssaysForm‘).serialize(),
success: function (data) {
console.log(data);
alert(data.msg);
},
error : function(result) {
alert("系统异常!"+result);
}
});
});

</script>
 

 

<form id="addEssaysForm" onsubmit="return false" action="##" method="post">
这里写成这样就可以了,但是具体的原因也是一个头两个大,不太明白,还请高手赐教!

 

ajax表单提交执行成功但是没有执行回调函数,并且post变get了

原文:https://www.cnblogs.com/wlv1314/p/12987525.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!