JQuery: делегировать добавление полей ввода, несколько раз

Question

Вот ссылка: Демонстрационная ссылка

Нажмите «Группа», затем нажмите «Денежный».Вы увидите форму с зеленым знаком «+».При нажатии этого зеленого «+» вместо нескольких вводятся несколько полей ввода.

Ниже приведен код нажатия кнопки «+».

Строка №: 178

jQuery('#input span.con').delegate('p a[id=add_field]', 'click', function(){ 


var Id = jQuery(this).attr('id');
Id = 1+ parseInt(Id); 

jQuery('#input span.con p span.text_field').append('<span class="text_field" id="'+ Id +'"><input type="text" name="pemails[]" class="text_field" /><a class="edit_field" name="delete" id="'+ Id +'" href=""><img src="'+base_url+'resource/images/fend/delete.png" border="0" /></a></span>');

return false;

});

Строка №: 472

jQuery('#input span.con').prepend('<p><label for="" class="label">Participent Email:</label><span class="text_field"><span class="text_field">Click here to add the data.<a class="edit_field" name="add_field" id="add_field" href=""><img src="'+base_url+'resource/images/fend/add.png" border="0" /></a></span><span class="text_field" id="1"><input type="text" name="pemails[]" class="text_field" /><a class="edit_field" name="delete" id="1" href=""><img src="'+base_url+'resource/images/fend/delete.png" border="0" /></a></span></span></p>');
    }

Для ссылки на файл js: Имя файла: wizard.js Строка №: 178 Строка №: 472 (добавляется знак «+» через javascript)

Может ли кто-нибудь направить меня туда, где я поступаю неправильно и как это можно исправить.

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

Answer 1

Вы не должны были повторять идентификаторы, никогда. Это может вызвать у вас проблемы.

Вы даете одинаковые идентификаторы (Id var) для диапазона и a в этой строке (а они числовые, не должно быть!)

jQuery('#input span.con p span.text_field').append('<span ... id="'+ Id +'">...<a ... id="'+ Id +'" ...>...</a></span>');

Мой совет: используйте идентификаторы, подобные следующим:

var aId = "a"+Id;
var spanId = "span"+Id;

Итак, у вас будет:

jQuery('#input span.con p span.text_field').append('<span ... id="'+ spanId +'">...<a ... id="'+ aId +'" ...>...</a></span>');

Надеюсь, это поможет. Приветствия