Question

我点击“添加”按钮时会创建一系列选择字段。选择字段是在无序列表中创建的，它有点像这样：

<li><select name="fieldname1"></select><input type='button' name='delbtn1'></li>
<li><select name="fieldname2"></select><input type='button' name='delbtn2'></li>
<!--etc-->

正如你所看到的，我在名字中给出了一个序列。这是为了允许我在提交表单后执行服务器端脚本。

我也允许用户删除列表项，但我想在删除后保留序列命名。这意味着：如果我在“1”到“3”之间删除“fieldname2”，我想将其重新排序为“1”和“2”。

我尝试使用.each（）方法浏览每个列表项，但无法正确重命名。真的不知道这里出了什么问题。

JS小提琴： http://jsfiddle.net/kosherjellyfish/JsW3a/3/

Answer 1

fiddle Demo

$("ul.criteriallist li .fieldname").each(function (index) {
    $(this).prop("name", "fieldname" + ++index);
});

<小时/> 或更好.prop()

fiddle Demo

$("ul.criteriallist li .fieldname").prop("name", function (index) {
    return "fieldname" + ++index;
});

<小时/> fiddle Demo

$("ul.criteriallist li .fieldname").prop("name", function (index) {
    return "fieldname" + ++index;
});
$("ul.criteriallist li .deletebtn").prop("name", function (index) {
    return "delete" + ++index;
});

<小时/> 代码问题

$("ul.criteriallist li").each(function (index) {
    $(".fieldname").attr("name", "fieldname" + index + 1);
    // $(".fieldname") refers to all elements so it sets same value to all
   //index + 1 will concatenate string if index is 1 than it will result 11
  //you can use $(this).find(".fieldname")
});

Answer 2

我在代码中找到了两个错误，

您正在使用类名直接重新分配名称。在那个地方你必须用$(this)来改变名字定位输入元素。
您concatenating index的{{1}}值arithmetic 计算

试试这个，

$("ul.criteriallist li").each(function (index) {
    $(this).find(".fieldname").attr("name", "fieldname" + (index + 1));
});

删除后重命名属性名称

2 个答案:

DEMO