Question

我有一个包含26个输入的表单行，有些文本是一些选择框。我有一个克隆顶行的按钮，为行号添加一个增量。但是，我正在努力研究如何增加克隆字段元素的名称和ID。

形式：

<tr id="CmasterRow" class="DB1_ROW">
                                                <td><span id="cnumber"> <input type="text" size="2" readonly class="form-control" id="DB1[0][A]" name="DB1[0][A]"  data-circuitNumber="0" data-EN="0"  value="0"></span></td>
                                                <td>    
                                                    <div class="input-group">                     
                                                        <input type="text" class="form-control" id="DB1[0][B]" name="DB1[0][B]" data-EN="1">
                                                        
                                                    </div>
                                                </td>                                       
                                                <td>    
                                                    <div class="input-group">                     
                                                        <input type="text" class="form-control" id="DB1[0][C]"   size="2" name="DB1[0][C]" data-EN="2">
                                                       
                                                    </div>
                                                </td>                                       
                                                <td>    

                                                    <input type="text" class="form-control" id="DB1[0][D]" size="4"  name="DB1[0][D]" data-EN="3">

                                                </td>                                  
                                                <td>    
                                                    <div class="input-group">                     
                                                        <input type="text" class="form-control" id="DB1[0][E]" size="3"  name="DB1[0][E]" data-EN="4">

                                                    </div>
                                                </td>   
<!-- ... etc ... etc ... -->
                                                         
</tr>

这是我目前使用的javascript（克隆行的工作）

        var template = $('#CmasterRow'),
        $("#addrow").click(function () {
            var row = template.clone();
            var n = $("[data-circuitNumber]").length;
            row.find('input').val('');
            row.find('[data-circuitNumber]').val(n);
            
            row.find('input').attr('name').replace(/\[([0-9]+)\]/g,"[" + n + "]");
            row.find('input').attr('id').replace(/\[([0-9]+)\]/g,"[" + n + "]");
            
            
            row.insertBefore($('#disBoard tbody>tr:last').eq(-1));
            // saveData(); - own function not needed for this issue.
            
           
            return false;

            /* Version 1 simple row clone
             var row = $('#disBoard tbody>tr:first').clone(true);
             var n = $("[data-circuitNumber]").length;
             row.find('input').val('');
             row.find('[data-circuitNumber]').val(n);
             row.insertBefore($('#disBoard tbody>tr:last').eq(-1));
             saveData();
             return false;
             */
        });

我认为'我使用.find和.replace以及正则表达式是正确的。我只是有点卡住让它工作。我确实使用单个表单元素工作（各种）但是java脚本已被切断并使用上面的内容进行更改，或者我将在此帖子中包含该工作。

感谢您的帮助：）

Answer 1

要更新节点的属性，请使用：

var newValue = 'whatever'
row.find('selector').attr('your attribute', newValue);

您的代码采用属性值，应用正则表达式然后什么都不做。

Answer 2

Javascript .replace不会替换原始字符串中的任何内容，并返回包含替换值的新字符串。

row.find('input').attr('name').replace(/\[([0-9]+)\]/g,"[" + n + "]");
row.find('input').attr('id').replace(/\[([0-9]+)\]/g,"[" + n + "]");

因此，上述行基本上会返回id和name的新值。您需要按照Eriks的建议采用这些值并应用它们。

var newId=row.find('input').attr('name').replace(/\[([0-9]+)\]/g,"[" + n + "]");
var newName=row.find('input').attr('id').replace(/\[([0-9]+)\]/g,"[" + n + "]");

row.find('input').attr('id',newId);
row.find('input').attr('name',newName);

Answer 3

            row.find('input').attr('id', function (i, val) {
                val = val.replace(/\[([0-9]+)\]/g, "[" + n + "]");
                return val
            });

            row.find('input').attr('name', function (i, val) {
                val = val.replace(/\[([0-9]+)\]/g, "[" + n + "]");
                return val
            });

感谢您的帮助，我现在明白了我的错误。我已完成任务，接受您的输入并开发上述代码

jQuery在具有多个输入的克隆行上的name属性内更改数字

3 个答案: