jquery - 在某些 div 中重命名文本字段的一部分

Question

我有一个 html 页面，其中有一些文本字段。每组文本字段都属于一个 DIV。我想更改某些文本字段的名称。但是，当您查看示例 html 时，这可能会变得更清楚：

http://jsfiddle.net/dg2Bz/

如您所见，第一个 div 有 3 个文本元素，名称如下：

test[something][xxxx]

但其他“虚拟” div 的文本字段带有数字：

<input name="test[100][name]" value="display" />
<input name="test[100][option1]" value="op1" />
<input name="test[100][option2]" value="op2" />

和

<input name="test[101][name]" value="borders" />
<input name="test[101][option1]" value="op1" />
<input name="test[101][option2]" value="op2" />

---

这些字段都属于一个div。我想要做的是更改名称的数字部分并将其替换为“名称”属性中具有“名称”的第一个文本字段的值。所以它变成了这样：

<input name="test[display][name]" value="display" />
<input name="test[display][option1]" value="op1" />
<input name="test[display][option2]" value="op2" />

和

<input name="test[borders][name]" value="borders" />
<input name="test[borders][option1]" value="op1" />
<input name="test[borders][option2]" value="op2" />

我不确定如何使用 jQuery 实际做到这一点。我敢肯定它是可能的，它可能涉及一些正则表达式。就是摸不着头脑...

Answer 1

这是一种可能的解决方案：

$(".dummy :input[name^=test]")​​​​​​​​​​​​​.attr("name", ​​function(i, value) {
    var name = $(this).parent().children(":first").val();
    return value.replace(/\[\d{3}\]/, "[" + name + "]");
});​

演示：http: //jsfiddle.net/dg2Bz/1/

Answer 2

尝试这个 ：

$(".dummy > input[name*=name]").change(function(){
    var newName = this.value;
    $.each($(this).parent(".dummy").find("input"),function(){
        $(this).attr("name",function(i,value){
            return value.replace(/\[\d{3}\]/, "[" + newName + "]");
        });
    });

});