ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – jQuery $.get()不会在表单提交时执行

2019-07-22 23:37:35  阅读:251  来源: 互联网

标签:html javascript jquery form-submit


提交表单时,我想异步调用带有一些$_GET参数的电子邮件发送脚本order.php.

jQuery $.get()函数不执行,控制台中没有显示错误.

HTML标记:

<form name="submit" id="orderconfirm" action="somefile.php">
<input type="hidden" name="orderkey" id="orderkey" value="somekey"/>
<input type="text" name="email" id="orderemail"/>
<input type="submit" value="submit"/>
</form>

jQuery脚本:

$(document).ready(function() {

$('#orderconfirm').submit(function() {
   var key = $('#orderkey').val();
   var email = $('#orderemail').val();
   var url = 'order.php?key=' + key + '&mail=' + email;
   $.get(url);
});

});

这真的很奇怪,因为类似的脚本(也是带有简单URL的$.get())工作得很好.我也确定order.php脚本工作正常,路径正确.问题是不会以某种方式执行$.get(url)并且不会发送任何请求.

提交处理程序也可以正常工作 – 例如警报有效.

有任何想法吗?

解决方法:

使用preventDefault()防止默认浏览器操作

$(document).ready(function() {    
    $('#orderconfirm').submit(function(event) {
       event.preventDefault();
       var key = $('#orderkey').val();
       var email = $('#orderemail').val();
       var url = 'order.php?key=' + key + '&mail=' + email;
       $.get(url);
    });    
});

Documentation

你也可以使用return false;限制表单提交

$(document).ready(function() {    
    $('#orderconfirm').submit(function(event) {
       var key = $('#orderkey').val();
       var email = $('#orderemail').val();
       var url = 'order.php?key=' + key + '&mail=' + email;
       $.get(url);
       return false;
    });    
});

要在$.get之后提交表单,试试这个,

$(document).ready(function() {    
    $('#orderconfirm').submit(function(event) {
       event.preventDefault();
       var key = $('#orderkey').val();
       var email = $('#orderemail').val();
       var url = 'order.php?key=' + key + '&mail=' + email;
       $.get(url,function(){$('#orderconfirm').submit()});
    });    
});

Documentation

标签:html,javascript,jquery,form-submit
来源: https://codeday.me/bug/20190722/1507572.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有