AJAX只在第一次点击后返回数据

AJAX returns data only after first click

本文关键字：返回 数据 第一次 AJAX      更新时间：2023-09-26

我有这个ajax请求脚本：

    function SendData(){
$( "#Submit" ).click(function() {
     $('#Submit').attr("disabled", true);
    $.ajax({
        type:"POST",
        url:"assets/process.php",
        data: {
            Years : $('#Years').val()
        },
        success: function(Response){
            if (Response.Status == 'Error') {                
                swal("Ups!", "Nemo' zebavaš", "error");
            } else if (Response.Status == 'Error0') {
                  swal("Ups!", "Servis 'Misterije' mogu koristiti samo rođene osobe!", "error");
            }
            else if (Response.Status == 'Error120') {
                  swal("Ups!", "Žao nam je! Niste podobni za korišćenje WEB Servisa 'Misterije'!", "error");
            } 
            else if (Response.Status == 'Success') {
                   swal("USPEŠNO!", 'Rođeni ste: '+Response.Calculated+' godine!', "success");
            }
            $('#Submit').attr("disabled", false);
        }
    });
});
}

当我在浏览器中加载页面，将数据添加到输入并点击按钮时，什么都不会发生，但在第二次和之后的所有点击，直到我刷新页面，一切正常。我怎样才能解决这个问题？

不要调用函数

将您的代码放入$（document）.ready函数

单击按钮时，您是否正在调用此SendData()函数？

这个函数并没有做你认为它在做的事情。它不是在调用AJAX请求这个函数所做的就是将点击处理程序附加到按钮上。没什么了。然后在下一次单击按钮时，该处理程序将执行。

（更不用说它还会再次附加另一个点击处理程序。所以第三次点击会调用该处理程序两次。以此类推…）

没有必要将所有这些都封装在一个函数中。取而代之的是：

function SendData(){
  $( "#Submit" ).click(function() {
    // your code
  });
}

只需这样做：

$( "#Submit" ).click(function() {
  // your code
});

这将附加单击处理程序，而不是调用它。之后的任何时候，当您单击按钮时，都会调用该处理程序。

最坏的情况是，如果在执行此代码时按钮还不存在，则必须执行此操作：

$(function () {
  $( "#Submit" ).click(function() {
    // your code
  });
});

这将等待document.ready事件和，然后附加处理程序。

（注意：一旦删除了SendData()函数，您还需要删除对该函数的任何引用。我假设您是从按钮内联调用它的。但当您使用jQuery附加单击处理程序时，不需要这样做。）

相关文章：