Как я могу использовать JQuery Delegate () правильно toggleclass?

Question

Я новичок в jquery, так что прости меня за недоразумения. я использую этот код:

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

для переключения класса на входе текстового поля ввода. Сначала этот код работал нормально, но так как я добавляю все это с помощью jquery, Делегат () переключает все флажки и поля ввода.

Вы можете видеть, что я имею в виду в этом коде: http://jsfiddle.net/eD5M5/

нажмите меня ---> добавляет кнопку добавления кнопка добавления ----> флажок добавления и поле ввода (+ кнопка удаления)

когда вы нажимаете "добавить" один раз, класс переключателя выглядит нормально! но когда вы нажимаете более одного раза и начинаете переключаться, все переключается!

Мой вопрос к вам:

Что я делаю не так и как я могу это исправить?

Заранее спасибо

Answer 1

Это потому что вы не увеличиваете счетчик, поэтому все входы имеют одинаковый класс: проверьте исправление

Answer 2

Им всем присвоен один и тот же класс, и вы выбираете их по классам, поэтому это повлияет на них всех.

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

Пример: http://jsfiddle.net/eD5M5/3/

$(this).next().toggleClass("complete");