Как добавить toggleClass в установленный флажок с jQuery?

Question

Я добавляю некоторые текстовые поля ввода и флажки onclick. Но когда установлен флажок, я хочу toggleClass ввести текстовое поле ввода. Это мой создать код:

jQuery(function() { 
var counter = 0; 

$('#appendbtn').click(function() { 
    var elems = '<div>' + '<input type="checkbox" id="checkbox"' + (counter) + '" class="item"/>' + '<input type="text" id="inputfield"' + (counter) + '"/>' + '</div>'; 
    $('#box').append(elems); 
    counter++; 
    return false; 
}); 

Это то, что должно произойти;

if ($("#checkbox").is(":checked")) 
{ 
$("inputfield" + counter).toggleClass("complete") 
}); 

Ofcourse это не правильно, но я надеюсь, что вы получите то, что я имею в виду;) это кстати можно без если заявление?

здесь является jsfiddle http://www.jsfiddle.net/gkdKY/

ой, и это именно то, что я хочу http://www.jsfiddle.net/xzmcL/ , но с прилагаемыми флажками!

Answer 1

Эта линия:

var elems = '<div>' + '<input type="checkbox" id="checkbox"' + (counter) + '" class="item"/>' + '<input type="text" id="inputfield"' + (counter) + '"/>' + '</div>'; 

... имеет две дополнительные кавычки. Оно должно быть:

var elems = '<div>' + '<input type="checkbox" id="checkbox' + (counter) + '" class="item"/>' + '<input type="text" id="inputfield' + (counter) + '"/>' + '</div>'; 

Это ломает ваш селектор для click события. Но обратите внимание, что это не сработает, поскольку вы пытаетесь подключить элемент, который не существует, пока не будет нажата ссылка «click me», поэтому вам нужно использовать .live() или .delegate() для этого.

Нечто подобное может работать:

$("#drag").delegate("input[type=checkbox]", "change", function(){ 
    var index = this.id.substring(8); 
    $("#inputfield" + index).toggleClass("complete"); 
}); 

Answer 2

Вы хотите:

$('input:checkbox').click(function(){ 
    $('#inputfield').toggleClass('bold'); 
}); 

Я предполагаю, что вы не устанавливать свои галочки проверил состояние истина динамически.