禁用.click()，然后重新启用它

Question

因此，我正在努力使其在元素被点击后，在我的$.post完成之前，点击功能将无法工作。

<div id="textbox_item">Click me</div>

这就是我现在拥有的，但它不起作用。我假设.prop('disabled', true)不适用于div元素。有人能帮我吗？

$("#textbox_item").click(function() {
    //don't let anyone click .textbox_item until $.post is complete
    $("#textbox_item").prop('disabled', true).text("Doing something..");
    $.post("/action", { item: "123" }).done(function( data ) { 
        $("#textbox_item").prop('disabled', false).text("Click me");        
    });
});

Answer 1

请考虑设置并检查.data()中的"禁用"数据属性。

$(".textbox_item").click(function() {
    //don't do anything if #textbox_item has been disabled
    if($("#textbox_item").data('disabled')) { return false; }
    //don't let anyone click .textbox_item until $.post is complete
    $("#textbox_item").data('disabled', true).text("Doing something..");
    $.post("/action", { item: "123" }).done(function( data ) { 
        $("#textbox_item").data('disabled', false).text("Click me");
    });
});

我还注意到，您似乎在混合ID和类选择器-我不知道这是有意还是无意，但我建议您仔细检查，以确保您知道要禁用什么并单击。

Answer 2

这里有两个问题：

• 您试图在div上使用button属性，但这是行不通的。HTML Disable属性不适用于div
• 您正在混合选择器。您的Click mediv有一个类textbox_item，但您的调用$("#textbox_item")正在寻找textbox_item作为id而不是作为类的东西。每次要引用此元素时，都应该使用$(".textbox_item")

HTML

<button class="textbox_item">Click me</button>

JS

$(".textbox_item").click(function()
    $(this).prop('disabled', true);
    $.post("/action", { item: "123" }).done(function( data ) { 
       $(".textbox_item").prop('disabled', false);
    });
});

Answer 3

为什么不专门使用jquery库提供的函数呢？

http://api.jquery.com/one/

button.one('click', function() {
     //on ajax success
     Button.one('click', func)
})