2013-12-25 5 views
2

Я делаю веб-приложение. В одной части у меня есть контрольный список, динамически созданный с помощью javascript.jQuery: Trigger, даже если флажок установлен.

Я хочу, чтобы функция jQuery выполнялась при проверке контрольного списка.

Вот код, который динамически генерируется контрольный список:

var checkbox = document.createElement("input"); 
    checkbox.setAttribute("type","checkbox"); 
    checkbox.setAttribute("class", "tickbox"); 
    document.getElementById("sortable").appendChild(checkbox); 

Вот вывод HTML файл на исполнение, который показывает, что флажок был фактически создан:

<input type="checkbox" class="tickbox"> 

Я хочу иметь функция, выполняемая, когда флажок установлен. Я пробовал:

1.

$('.tickbox').change(function() { 
     alert("Here"); 
     if ($(this).attr("checked")) { 
     alert("Yeah"); 
     } 

2.

if($(.tickbox).is(':checked')){ 
     alert("Yeah!!!"); 

3.

$('.tickbox').each(function(){ 
    if($(this).is(':checked')){ 
     alert("Yeah!!!"); 
    } 
    }) 

Но ничего не получалось. Что не так? Что мне делать?

Примечание: многие другие javaScript и jQuery, включая многие другие вызовы функций, работают совершенно нормально.

ответ

2

Вы сказали, что у вас есть динамически добавленный флажок, поэтому, чтобы добавить обработчик событий в этот DOM, вы должны использовать .on().

Пример.

$(document).on('change','.tickbox',function(){ 
    if($(this).is(':checked')){ 
     alert("Yeah!!!"); 
    } 
}) 
0

для динамически генерируемого элемента вам необходимо использовать на():

$(document).on("change",'.tickbox',function() { 
    if ($(this).attr("checked")) { 
    alert("Yeah"); 
} 
}); 

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

+0

@coder обновил пост, проверьте в настоящее время –

1

Попробуйте это ....

var checkbox = document.createElement("input"); 
    checkbox.setAttribute("type","checkbox"); 
    checkbox.setAttribute("class", "tickbox"); 
    document.getElementById("sortable").appendChild(checkbox); 
$(".tickbox").click(function(){ 
    if ($(this).is(':checked')) { 
     alert("checked"); 
    } 
}); 

Пример: http://jsfiddle.net/7xY8Y/

+0

работает нормально, когда только один флажок присутствует, но не с несколькими. Я фактически использую несколько флажков. – coder

Смежные вопросы