克隆元素时,我试图更改元素的ID,基本上,我会保留一个计数器,该计数器会在每次克隆时在ID的末尾递增并添加.似乎很简单.
var addAnswerFlag = true;
function addAnswer(button)
{
//flag to keep clicks from chaining
if(addAnswerFlag)
{
addAnswerFlag = false;
$('#answer_warning').fadeOut(600);
$('.template').clone().attr('id','').insertAfter($('.template')).fadeIn(300,function() {
$(this).removeClass('template');
addAnswerFlag = true;
$('.answer_li:not(.template)').each(function(index){
++index;
$(this).children('.answer').each(function(){
$(this).attr('id',$(this).attr('id').replace("__","_"+index+"_")).attr('name',$(this).attr('name').replace("__","_"+index+"_"));
});
});
});
}
}
抱歉,如果我的代码不清楚.
基本上,我的第一个循环遍历了所有列表元素(带有伪数据的模板元素除外),并接受每个“ .answer”,并将双下划线“ __”替换为“ i”,其中i是计数器.
由于某种原因,我始终为1.我知道每个列表项的值都会增加,因为如果我在尝试重新分配ID之前和之后提醒其值,则该值会上升,但在实际分配中它始终为1.
这是我非常困惑的地方.任何帮助,将不胜感激 ：)
编辑：
这是一些HTML.基本上,我在这里遍历列表项,并更改输入的ID和名称,以便在提交输入后就可以对其进行处理：
<ul id="answers">
<li style="" class="answer_li template">
<input id="question__en" name="question_[en]" class="answer" value="" type="text">
<input id="question__fr" name="question_[fr]" class="answer" value="" type="text">
</li>
<li id="" style="display: list-item;" class="answer_li">
<input id="question_1_en" name="question_[en]" class="answer" value="" type="text">
<input id="question_1_fr" name="question_[fr]" class="answer" value="" type="text">
</li>
</ul>
如您所见,第一个是我的模板,第二个在下划线之间添加了索引.但是,当我克隆模板时,它们都获得相同的索引.我真的不明白,因为如果我警告该值正确地增加了,我就很困惑,以至于我回到了基本的JavaScript教程中,看看是否缺少某种偶然使用的运算符：)
最佳答案
每个函数将提供索引(从零开始),因此无需保留单独的变量.请注意,索引将是每次迭代的新值,因此您无需推理闭包是否正确.
$('.answer_li:not(.template)').each( function(index){
++index; // to get one-based values
$(this).children('.answer').each( function(){
$(this).attr('id',"_"+index+"_"));
});
});
