Question

我有一个用javascript创建的表。在每一行我添加一个复选框。在选中复选框时，必须显示警告消息。如何将oncheck属性添加到javascript中的动态复选框。

var tblRow = "<tr><td Style='display: none'>" + data.IxDetails
        "</td><td>" + data.Name +
             "</td><td>" + GroupTable +
              "</td><td>" + (data.AllowFileAttachment == true ? "Yes" :"No" )  +
        "</td><td>" + (data.SetToInActive == true ? "INACTIVE" : "ACTIVE" ) +
              "</td><td><input type = 'checkbox' id='" +
       data.Index + "' name='selectedData'  value='123' "+
        "</td><td><input type = 'checkbox' id='dl" +
       data.Index + "' name='selectedData'  value='123' >" +
        "</td></tr>";
        $('#DataTable> tbody:last').append(tblRow);

Answer 1

试试我：

 $('table tr').find('input:checkbox').on('click', function(){
         alert("I'm clicked!");
 });

SIMPLEST DEMO FIDDLE

Answer 2

由于checkbox是动态添加的，因此您需要使用event delegation来注册事件处理程序。

// New way (jQuery 1.7+) - .on(events, selector, handler)
$('#DataTable').on('click', ':checkbox', function(event) {
    event.preventDefault();
    alert('testlink'); 
});

这会将您的活动附加到checkbox元素中的任何#DataTable，减少必须检查整个document元素树并提高效率的范围。

A SIMPLE WORKING FIDDLE DEMO

Answer 3

var tblRow = "<tr><td Style='display: none'>" + data.IxDetails
        "</td><td>" + data.Name +
             "</td><td>" + GroupTable +
              "</td><td>" + (data.AllowFileAttachment == true ? "Yes" :"No" )  +
        "</td><td>" + (data.SetToInActive == true ? "INACTIVE" : "ACTIVE" ) +
              "</td><td><input type = 'checkbox' onchange='yourfunction()' id='" +
       data.Index + "' name='selectedData'  value='123' "+
        "</td><td><input type = 'checkbox' onchange='yourfunction()' id='dl" +
       data.Index + "' name='selectedData'  value='123' >" +
        "</td></tr>";
        $('#DataTable> tbody:last').append(tblRow);

Answer 4

动态添加控件可以更好地使用

<input type = 'checkbox' id='dl" +
       data.Index + "' name='selectedData' href="javascript:void(0);" onclick="dynaclick('id1')"  value='123' >

和javascript函数是

function dynaclick(id){
alert('checkbox with'+id+' is clicked');

}

Answer 5

对于动态生成的内容，您可以使用on

$("form").on("change", function(event) {
  alert('Checkbox click!');
});

将属性添加到javascript中生成的动态控件

5 个答案: