0

我正在创建一个带有复选框列表的表,其中包含从 JSON 文件中读取的值。

每次单击复选框时,我都想执行检查的功能计数。不幸的是,JQuery$("input[type=checkbox]")不能识别动态创建的复选框。唯一有效的复选框是直接写在正文代码块中的复选框。

我怎么能说 JQuery 来检查新创建的复选框?

<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
    $("#get").click(function(){
        $.getJSON("data.txt",function(result){
            $("#b").append('<form><table></table></form>');
            $.each(result['effectNames'], function(i, field){
                $("table").append('<tr><td>' + field + '</td><td><input type="checkbox" value="' + i + '" ></td></tr>');
                });
            });
    });
    var countChecked = function() {
      var n = $( "input:checked" ).length;
      $( "#a" ).text( n + (n === 1 ? " is" : " are") + " checked!" );
    };
    countChecked();
    $( "input[type=checkbox]" ).on( "click", countChecked );
});
</script>
</head>
<body>
    <button id="get">Get JSON data</button>
    <input type="checkbox" name="r" value="Hourly" checked="checked">
    <div id="b"></div>
    <div id="a"></div>
</body>
</html>
4

1 回答 1

4

你需要在这里使用事件委托

$("#b").on( "click", "input[type=checkbox]", countChecked );
于 2013-08-09T10:00:49.087 回答