单击单击后禁用单击的元素

Question

我有一个保存用户编辑内容的按钮。由于它在服务器上造成的负载，我不希望它们多次点击保存按钮。我想在点击它后禁用该按钮。 这是我尝试过的（虽然不起作用）：

  var active = true;
  $("#save").click(function() {
    if (!active) return;
    active = false;
........
........
........
    active = true;

问题是用户仍然可以多次点击该元素。 我该如何解决这个问题？

编辑：对不起，我忘了提到我想在onc​​lick代码执行完毕后启用点击。

Answer 1

试试这个

$("#save").one('click', function() {
    //this function will be called only once even after clicking multiple times
});

Answer 2

有一个disabled属性：http://jsfiddle.net/uM9Md/。

  $("#save").click(function() {
    $(this).attr('disabled', true)
........
........
........
    $(this).attr('disabled', false)
  });

Answer 3

你可以取消绑定点击处理程序，但我会根据@ ShankarSangoli的答案（+1）与.one一起使用。

$("#save").click(function() {

    // do things

    $(this).unbind("click");

});

http://api.jquery.com/unbind/

Answer 4

如果元素是输入，你可以很容易地做到这一点：

<input name="BUTTON" type="submit" value="Submit" onSubmit="document.BUTTON.disabled = true;">

那里有一些方便的HTML Javascript集成。

Answer 5

假设：

<input type="button" id="save" ... />

您可以这样做：

$('#save').click(function(){
    var $save = $(this);

    //
    // save code
    //

    $save.get(0).disabled = true;
});

本机禁用了该按钮，或者您可以使用jQuery的one功能：

$('#save').one('click',function(){
    //
    // save code
    //
});

只执行一次，必须重新绑定。 （但如果你决定根据参数启用/禁用，使用disabled attribute可能是更好的选择。）