Включение/выключение события Click для элемента с помощью jQuery

Question

Я хочу включить/отключить событие click для элемента. У меня следующий код ...

HTML:

<a id="CP" style="cursor: pointer; text-decoration: underline;">Current Processes</a> 

JQuery:

$(document).on("click", "#CP", function(event) { 
    $this = $(this); 
    $this.click(function() { 
     return false; 
    }); 
    $this.html("Processing...").css({ 
     "text-decoration": "none", 
     "cursor": "default" 
    }); 
    $.ajax({ 
     type: 'post', 
     url: 'abc.jsp', 
     success: function(process) { 
      //My code goes here... 
      $this.on("click"); // Here i want to bind or add handler which is fired previously. 
     } 
    }); 
}); 

Answer 1

Если я хорошо понимаю, вы могли бы сделать это очень просто следующим:

$this.html("Processing...").css({ 
    "cursor": "wait", 
    "pointer-events": "none" 
}); 

Answer 2

$this.on("click") - это эффективно: "привязать обработчик щелчка к $ это, что не будет делать ничего"

Для запуска использования события: $this.click() или $this.trigger("customEvent")

Answer 3

Может быть, вы должны использовать bind("click"), чтобы вы могли отвязать его. например, $("#CP").bind("click",function(){..function to run // disable the click event from CP $("#CP").unbind("click"); });. Удачи!

Answer 4

var eventhandler = function() { 

    $(document).unbind("click"); 
    $this.html("Processing...").css({ 
     "text-decoration": "none", 
     "cursor": "default" 
    }); 
    $.ajax({ 
     type: 'post', 
     url: 'abc.jsp', 
     success: function(process) { 
      //My code goes here... 
      //Here i want to bind or add handler which is fired previously. 
      $(document).click(eventhandler); 
     } 
    }); 
} 


jQuery(document).click(eventhandler); 

Answer 5

Добавить класс при выполнении запроса AJAX. Удалите, когда закончите. Не делайте ничего, если ссылка имеет этот класс.

$(document).on("click", "#CP", function(event) { 
    event.preventDefault(); 
    $a = $(this); 
    if($a.hasClass('disabled')) { 
     return false; 
    } 

    $a.html("Processing...").addClass('disabled'); 
    $.ajax({ 
     type: 'post', 
     url: 'abc.jsp', 
     success: function(process) { 
      $a.removeClass('disabled'); 

      // restore inner HTML here 
     } 
    }); 
});