jquery .clone () странное поведение в Firefox - PullRequest
Новая
       13

jquery .clone () странное поведение в Firefox

1 голос
/ 26 января 2010

У меня следующая проблема - я использую jQuery для добавления дополнительных форм ввода на страницу. Но добавленные строки не передаются на сервер с отправкой формы.

Вот HTML-код одной строки: 

<form name="form1" method="post" action="">

<div id="input1" class="clonedInput">

<label for="answer1" class="answer_label"> Answer: </label>
<input type="text" name="answer1" id="answer1" value="Answ1"/>
<label for="answer1pt"> Points: </label>
<input type="text" name="answer1pt" id="answer1pt" size="2" value="1"/>

для клонирования я использую следующий JavaScript: 

$('#btnAddAnswer').click(function() {

var num  = $('.clonedInput').length;
var newNum = new Number(num + 1);
var newElem = $('#input' + num).clone().attr('id', 'input' + newNum); 

newElem.find(":nth-child(1)").attr('for', 'answer' + newNum);
newElem.find(":nth-child(2)").attr('id', 'answer' + newNum).attr('name', 'answer' + newNum).attr('value', '');
newElem.find(":nth-child(3)").attr('for', 'answer' + newNum + 'pt');
newElem.find(":nth-child(4)").attr('id', 'answer' + newNum + 'pt').attr('name', 'answer' + newNum + 'pt').attr('value', ''); 

$('#input' + num).after(newElem);
$('#btnDelAnswer').attr('disabled','');

if (newNum == 5)
        $('#btnAddAnswer').attr('disabled','disabled');
});

Итак, я сначала клонирую div со всем содержимым, а затем просто настраиваю id и другие атрибуты.

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

Этот код прекрасно работает в Chrome и даже в IE, но не в Firefox. Любые предложения о том, что я делаю не так или что может вызвать эту проблему?

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

Ответы [ 2 ]

1 голос
/ 26 января 2010

Проблема решена. * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *. В консоли ошибок браузера не отображались никакие сообщения. все проблемы.

0 голосов
/ 26 января 2010

Могу ли я настоятельно рекомендовать вам попробовать очистить селекторы, используя классы вместо nth-child? Это сделает весь ваш код более читабельным. Например, если у вас была разметка вроде: 

<label class="answer-label" for="answer1">...</label>
<input type="text" class="answer-box" name="answer1" class="answer1" />

Тогда вы можете использовать этот более красивый Javascript: 

newElem.find(".answer-label").attr('for', 'answer' + newNum);

Кроме того, вы можете рассмотреть возможность хранения только одной переменной вместо num и newNum. Таким образом, каждый раз вы можете просто сделать num++; вместо var newNum = new Number(num+1);. (Я также не уверен, почему вы делаете new Number(num+1) вместо просто var newNum = num+1;.

Если вы сомневаетесь, очистите ваш код, и все может просто исправить.

...