jQuery $.ajax 帖子在 Chrome 中有效,但在 Firefox 中无效

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18274383/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 21:18:48  来源:igfitidea点击:

$.ajax post working in Chrome, but not in Firefox

jqueryajaxfirefox

提问by Marko Kava?

Okay, I'll be short. I have this script which is putting values in database. It's working perfect in Chrome, Safari, but can't make it work in Firefox or IE. It seems that data isn't even being posted to .php file and ajax is not starting at all. Anyone, please?

好吧,我会很短。我有一个将值放入数据库的脚本。它在 Chrome、Safari 中运行良好,但无法在 Firefox 或 IE 中运行。似乎数据甚至没有被发布到 .php 文件中,ajax 也根本没有启动。请问有人吗?

This is my jquery script:

这是我的 jquery 脚本:

$(document).ready(function(){
$("#dodaj").click(function(){
  event.preventDefault();
  var kategorija = $("#kategorija option:selected").val();
  var si = $("#si").val();
  var hu = $("#hu").val();
  var de = $("#de").val();
  var an = $("#an").val();
  var hr = $("#hr").val();

$.ajax({
    type: "POST",
    url: "dodaj_v_bazo.php",
    data: {"kategorija": kategorija, "si": si, "hu": hu, "de": de, "an": an, "hr": hr},
    success: function(data){
        alert( "Jed uspe?no dodana."+data);
    }, 
});
return false;
});
});

This is the content in my php file:

这是我的php文件中的内容:

$kategorija = $_POST['kategorija'];
$si = $_POST['si'];
$hu = $_POST['hu'];
$de = $_POST['de'];
$an = $_POST['an'];
$hr = $_POST['hr'];

$dodaj_v_bazo = "INSERT INTO jedi (kategorija, si, hu, de, an ,hr) VALUES ('$kategorija', '$si', '$hu', '$de', '$an', '$hr')";
mysql_query($dodaj_v_bazo) or die(mysql_error());

回答by Felix Kling

You didn't define eventas parameter of the event handler, hence in

您没有定义event为事件处理程序的参数,因此在

event.preventDefault();

the browser tries to look up eventin the global scope. Chrome happens to provide the event object in global scope (hence no error) but Firefox doesn't (hence an error).

浏览器尝试event在全局范围内查找。Chrome 恰好在全局范围内提供事件对象(因此没有错误),但 Firefox 没有(因此出现错误)。

I'd suggest to add the eventparameter to the event handler:

我建议将event参数添加到事件处理程序:

$("#dodaj").click(function(event){
    event.preventDefault();
    // ...
});

There is an additional difference: If you don't define the eventparameter, eventwill refer to the nativeevent object in Chrome, which is different than the event object which jQuery passes to the handler.

还有一个额外的区别:如果不定义event参数,event将引用Chrome 中的原生事件对象,这与jQuery 传递给处理程序的事件对象不同。

To learn more about event handling with jQuery, I recommend to go through these articles.

要了解有关使用 jQuery 处理事件的更多信息,我建议阅读这些文章

回答by Tayyab Ali

Async call might not work in FF if you it triggered on form submission. You can add async:false to your ajax call and it will work. It is either that or the fact that you have cross domain call that you will have to fix through CORS.

如果异步调用在表单提交时触发,则它可能无法在 FF 中工作。您可以将 async:false 添加到您的 ajax 调用中,它会起作用。您必须通过 CORS 修复跨域调用,或者是事实。

回答by Sarthak Srivastava

The Firefox missing the $ajaxasync call has been fixed in the Firefox v49.0.2 and above.

$ajaxFirefox v49.0.2 及以上版本中修复了Firefox 缺少异步调用的问题。

$(document).ready(function(){
$("#dodaj").click(function(){
  event.preventDefault();
  var kategorija = $("#kategorija option:selected").val();
  var si = $("#si").val();
  var hu = $("#hu").val();
  var de = $("#de").val();
  var an = $("#an").val();
  var hr = $("#hr").val();

$.ajax({
    type: "POST",
    url: "dodaj_v_bazo.php",
    data: {"kategorija": kategorija, "si": si, "hu": hu, "de": de, "an": an, "hr": hr},
    success: function(data){
        alert( "Jed uspe?no dodana."+data);
    }, 
});
return false;
});
});

The above code will work when you upgrade to Firefox v49.0.2 or above.

当您升级到 Firefox v49.0.2 或更高版本时,上述代码将起作用。