Question

我有以下代码用来禁用addnotice按钮，因此也禁用了click事件处理程序。

$( "#div_violation_template" ).on( "switchbuttonon",".switch-button-start-eviction", function( event, ui ) {
    $( "#div_violation_template .addNotice").addClass('disabled').off('click');
} );

类似地，我启用了按钮addNotice链接应该可以单击并执行所需的操作，但是它仅删除了类，并且在单击addNotice按钮之后没有任何反应。

$( "#div_violation_template" ).on( "switchbuttonoff",".switch-button-start-eviction", function( event, ui ) {
    $( "#div_violation_template .addNotice").removeClass('disabled').on('click');
} );

使用点击事件有什么问题？我认为绑定点击事件类似，但不起作用。任何想法？

Answer 1

.on('click')不会执行任何操作，因为您没有定义单击按钮时将运行的回调函数。

但是您为什么认为需要删除单击处理程序然后重新添加它？如果您使用禁用的属性（实际上不只是向其中添加CSS类）将按钮实际上禁用了，那么click事件将始终无法运行。

演示：

$(function() {
  $("#btn1").click(function() { 
    $("#btn3").addClass("disabled").prop("disabled", true); 
  });
  $("#btn2").click(function() { 
    $("#btn3").removeClass("disabled").prop("disabled", false); 
  });
  $("#btn3").click(function() { alert("Clicked Button 3") });
});

.disabled {
  background-color:yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btn1">Button 1 - click to disable Button 3</button>
<button id="btn2">Button 2 - click to enable Button 3</button>
<br/><br/>
<button id="btn3">Button 3 - click to see alert when enabled</button>

在您的特定代码中为：

$( "#div_violation_template" ).on( "switchbuttonon",".switch-button-start-eviction", function( event, ui ) {
    $( "#div_violation_template .addNotice").addClass('disabled').prop('disabled', true);
});

$( "#div_violation_template" ).on( "switchbuttonoff",".switch-button-start-eviction", function( event, ui ) {
    $( "#div_violation_template .addNotice").removeClass('disabled').prop("disabled", false);
});

Answer 2

尝试类似的东西

$("#div_violation_template").on("switchbuttonoff",".switch-button-start-eviction", function( event, ui ) {
     $( "#div_violation_template .addNotice").on('click',function(e){
           $(this).removeClass('disabled');
     });
});

启用按钮后绑定单击事件

2 个答案: