Javascript jQuery只允许在.ajax（）之前单击一次

我试图允许只单击一次按钮，然后通过ajax提交一些数据。我面临的问题是，用户可以点击50次，每次都会提交数据

jQuery("#id").unbind('click');

jQuery.ajax({
    type: "POST",
    url: ajax_url,
    data: ajax_data,
    cache: false,
    success: function (html) {
        location.reload(true);
    }
});

如果用户单击

#ID

100x，我如何确保数据只提交一次？然后重新启用#ID？

您可以在jQuery中使用该函数

jQuery("#id").one('click', function()
{
    jQuery.ajax({
        type: "POST",
        url: ajax_url,
        data: ajax_data,
        cache: false,
        success: function (html) {
            location.reload(true);
        }
    });
});

---

请记住，这将完全删除单击事件，即使您的ajax出现错误，您仍然无法再次单击它。

最简单的方法是使用一个在触发成功时重置的标志：

if(clicked == False){
    clicked = True;
    jQuery("#id").unbind('click');

    jQuery.ajax({
       type: "POST",
       url: ajax_url,
       data: ajax_data,
       cache: false,
       success: function (html) {
           location.reload(true);
           clicked = False;
       },
       error: function () {
            alert("Error happened");
           clicked = False;
       }
    });
}

---

您可以禁用以控制，或使用许多模式库中的一个来显示旋转的轮子

---

查看此图

您可以禁用单击按钮事件，并在ajax请求完成时重新启用它。

在单击事件中，您可以禁用按钮，然后在ajax事件的成功功能中重新启用按钮

另一个选项是在被单击的元素上设置一个参数，以指示按钮已被单击，然后检查是否已设置，如果已设置，则不发送ajax请求，如果未设置，则发送。ajax完成后，您可以再次取消设置参数以允许其运行。

尝试以下操作：

$(document).ajaxStart({ function() {
 $('#submit_button').click(function(){
   return false;
 });
});

其中：#提交按钮是要禁用的元素的id

---

该代码将禁用单击提交按钮

只需禁用按钮即可

$("#id").attr("disabled", "disabled")

然后在成功函数中启用它

$("#id").removeAttr("disabled")

---

谢谢你的回复：）？那么我可以在这之后使用解除绑定吗？不，您不需要使用

unbind

功能，它会为您执行此操作。正如Supertramp所说，如果AJAX请求中出现错误，最好

绑定
单击事件。感谢您的响应，但这似乎禁止在用户单击时提交AJAX？i、 e.单击div后，它不会执行任何操作？您可能还需要添加一个回调，以确保异步请求得到处理，事件等待响应。感谢@sruly-但我使用div作为按钮：），因此不能使用attr等-但是+1ok将其更改为按钮：）更容易一些，尽管.One（）也是正确的——它演奏得不太好：）这也适用于女主角。如果您使用的是按钮，则可以使用上面的按钮。就我而言，我使用的是td。这对我有用+1您也应该从服务器端进行验证！