不工作复选框检查

当我从输入添加到div值，我需要点击复选框，以便其警报（“检查”）。我的代码无法正常工作。你能告诉我我做错了什么吗？不工作复选框检查

这里是我的代码

HTML：

<div class="container"> 
    <form> 
     <p>Title:</p> 
     <input type="text" id="title"> 
     <p>Link:</p> 
     <input type="text" id="link"> 
    </form> 
    <br> 
    <button class="btn btn-success">Add</button> 
</div> 

<div class="content" style="margin-top:50px"></div>

JQuery的：

$(function() { 
    $(".btn-success").click(function(){ 
     var title_val = $("#title").val(); 
     var link_val = $("#link").val(); 
     $(".content").append('<div class="col-xs-6 col-md-4"><ol class="breadcrumb"><h4>'+title_val+'</h4><input type="checkbox" id="checkbox"></ol><a href="http://'+link_val+'" class="thumbnail"></a></div>'); 
    }); 

    $("#checkbox").click(function(){ 
     if($(this).is(":checked")) { 
      alert("Checked"); 
     } 
    }); 
});

JSfiddle

来源

2015-08-28 Viktor

尤为什么你的代码不能正常工作总是使用上，如果你的U [R动态添加HTML之后，其他从未使用的ID，如果你加入了同一个ID多个元素总是喜欢类的第一个原因。 – Developer

@Gaurav没有动态添加元素的委托，事件不起作用。我不知道是谁投了你的答案。严重的是，StackOverflow的质量已经下降。 –

复选框动态添加。所以，你需要委派事件处理已经存在的元素，并确保不给同一ID S：

$(document).on("click", ".checkbox", function(){ 
    if($(this).is(":checked")) { 
     alert("Checked"); 
    } 
});

更改您的追加功能，而不是使用ID级别。

$(".content").append('<div class="col-xs-6 col-md-4"><ol class="breadcrumb"><h4>'+title_val+'</h4><input type="checkbox" class="checkbox"></ol><a href="http://'+link_val+'" class="thumbnail"></a></div>');

来源

2015-08-28 08:42:43

我同意你的答案，正确 – Developer

你的回答是最好的，我刚刚分享了我的想法 – Developer

谢谢@Gaurav。 '：）' –

DEMO

$('.content').on('click', "input[type='checkbox']", function() { 
    if ($(this).is(":checked")) { 
     alert("Checked"); 
    } 
});

来源

2015-08-28 08:42:58 RRK

ID不能被复制。基本规则。 –

@PraveenKumar是的，你是对的。但我没有注意到可以添加多个复选框。 – RRK

添加类的复选框，然后是jQuery的使用这个代码：

$('.chk').live('click',function(){ 
     if($(this).is(":checked")) { 
      alert("Checked"); 
     } 
    })

检查此链接Link

来源

2015-08-28 08:46:05 Developer

请添加事件委托的概念。 –

@PraveenKumar http://jsfiddle.net/ken94tz6/3/ – Developer

1.您的代码与小提琴不同。 2.使用'.live（）'？尼斯。那已经很久没有回来了。 –

Use this code 
 
$(document).on('click', '#checkbox' , function(){ 
 
    if($(this).is(":checked")) { 
 
    alert("Checked"); 
 
    } 
 
});

上

来源

2015-08-28 09:12:53

不工作复选框检查

回答

相关问题