禁用和启用基于条件

Question

<script> 
$(document).ready(function() 
{ 
$("[id^=column]").unbind('click',popup); 
}); 

function popup() 
{ 
    alert('gggg'); 
} 

function enable() 
{ 
    $("[id^=column]").bind('click',popup); 
} 
</script> 

<a onclick="enable()">enable</a> 
<table width="200" border="1" style="border-collapse:collapse;"> 
<tr><td id="column1" onclick="popup('a')">1</td></tr> 
<tr><td id="column2" onclick="popup('b')">2</td></tr> 
<tr><td id="column3" onclick="popup('c')">3</td></tr> 
<tr><td id="column4" onclick="popup('d')">4</td></tr> 
<tr><td>5</td></tr> 
</table> 

嗨onclick事件，

我想在页面加载的onclick禁用表TD一旦他点击链接启用则只有TD的onclick将被启用？如何达致这？

感谢

Answer 1

您需要删除onclick属性，.unbind()除去仅由bind()

$(document).ready(function() { 
    $("#column1").removeAttr('onclick'); 
}); 

演示加入这些处理程序：Fiddle

Answer 2

为什么不仅绑定时弹出功能启用链接被点击？

<script> 
function popup() 
{ 
    var $this_el = $(this); 
    var param_1 = $this_el.attr("data-parameter-1"); 
    alert('Parameter is: ' + param_1); 
} 

// bind click event to td 
function enable() 
{ 
    $('.clickable').on('click', popup); 
} 

// bind click event to enable link 
// using .one() will unbind itself after it is triggered once. 
$(document).ready(function() 
{ 
    $('#enabler').one('click', enable); 
}); 
</script> 

<a id="enabler">enable</a> 
<table width="200" border="1" style="border-collapse:collapse;"> 
<tr><td id="column1" class="clickable" data-parameter-1="a">1</td></tr> 
<tr><td id="column2" class="clickable" data-parameter-1="b">2</td></tr> 
<tr><td id="column3" class="clickable" data-parameter-1="c">3</td></tr> 
<tr><td id="column4" class="clickable" data-parameter-1="d">4</td></tr> 
</table> 

Answer 3

可以删除HTML中a标记内的内联事件处理程序。这个事件处理程序可以纯粹用Javascript来分配。

为a标记的点击事件处理函数指定回调。在此函数内部，设置#column1上的单击事件处理程序。

HTML

<a>enable</a> 
<table width="200" border="1" style="border-collapse:collapse;"> 
<tr><td id="column1" onclick="popup()">1</td></tr> 
<tr><td>2</td></tr> 
<tr><td>3</td></tr> 
<tr><td>4</td></tr> 
<tr><td>5</td></tr> 
</table> 

的Javascript

$(document).ready(function() 
{ 
    $("a").one("click",function(){ 
     $("#column1").click(function(){ 
      popup(); 
     });  
    }); 
}); 

function popup() 
{ 
    alert('gggg'); 
} 

JS小提琴：http://jsfiddle.net/TCrR4/

Answer 4

试试这个哥们..

我做你的代码的一些变化..

$(document).ready(function() 
{ 
    $("a").click(function(){ 
    if($(this).hasClass("action")) 
     { 
     $("#column1").removeClass("action") 
     $("#column1").bind("click",function(){ 
     alert("hiii"); 
     $(this).unbind("click");}); 
     alert("binded"); 
     } 
    else 
    { 
     $("#column1").addClass("action") 
     $("#column1").unbind("click"); 
     alert("unbinded"); 
     } 
}); 
});