选中复选框时取消绑定链接

Question

我有很多复选框和链接。如果选中复选框，我希望激活链接。

$("a[id^='link-'], a.disabled").unbind("click");
$('#alljc').on("change", ":checkbox", function () {
    if (this.checked) {
        $('#link-'+this.id).bind('click');
    } else {
        $('#link-'+this.id).unbind('click');
    } 
});

Html示例：

<div id="alljc">
    <form class="text-center" action="#">
        <input type="checkbox" id="6" />
        <a id="link-6" href="i-aggre.php?id=6">i m ok</a>
    </form>
    ...
</div>

Answer 1

正如我在上面的评论中指出的，我认为您不能也不应该走.bind()/.unbind() (或.on()/.off())路由。相反，试着：

$('#alljc a').click(function(e) {
    if ($(this).prev('input').is(':not(:checked)')) e.preventDefault()
})

jsFiddle实例

Answer 2

unbind可以解除指定的单击处理程序的绑定，它不会为本机功能做任何事情。最好的选择是切换href属性(为方便起见，将href存储在data-* attr中)

<a id="link-6" data-target="i-aggre.php?id=6" href="i-aggre.php?id=6">i m ok</a>

联合来文：

$('#alljc').on("change", ":checkbox", function () {
    if (this.checked) {
        var href = $(this).data("target");
        $('#link-'+this.id).attr('href', href);
    } else {
        $('#link-'+this.id).attr('href', '');
    } 
});

Answer 3

尝试usind preventDefault()和off()检查我的演示Fiddle

$("a[id^='link-'], a.disabled").on('click',function(e){
    e.preventDefault();
});

$('#alljc').on("change", ":checkbox", function(){
    var actId=$(this).attr('id');
    if ($(this).is(':checked')) {
        $('a#link-'+actId).off('click');
    } else {
       $('a#link-'+actId).on('click',function(e){
           e.preventDefault();
       })
    } 
});