добавление атрибута к динамическим элементам управления, сгенерированным в javascript

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

Для динамически генерируемого содержимого, вы можете использовать on

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

Answer 2

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 3

Поскольку 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 4

испытай меня:

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

SIMPLEST DEMO FIDDLE

Answer 5

для динамически добавляемых элементов управления лучше использовать

<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'); 

}