0

我正在尝试更改克隆表行的名称属性。这是我的代码：

    var ipCount = 2;
$("#input_form").on("click", "#add_input_param", function() {
    $('#input_param tr').eq(1).clone().find('input').val('').end()
            .appendTo('#input_param > thead')
            .find('*[name]')
            .each(function() {
        console.log($(this).attr('name'));
        $(this).attr('name', 'new_name');
        console.log($(this).attr('name'));
    });
    ipCount++;
});

在控制台上，它将名称 attr 更改为 new_name 但当我在 Chrome DevTools 上执行 Inspect Element 时未显示。这是控制台：

    :ops1/6/1/1_param js.js:48
    new_name js.js:50
    :ops1/6/1/1_type js.js:48
    new_name js.js:50
    :ops1/6/1/1_required js.js:48
    new_name js.js:50
    :ops1/6/1/1_desc js.js:48
    new_name js.js:50
    :ops1/6/1/1_location js.js:48
    new_name

点击后的 HTML 在 DevTools 上显示：

    <input type="text" name=":ops1/6/1/1_param" class="ui-input-text ui-body-c">

我一直在尝试交互 name 属性，但是当我这样做时它似乎没有改变。

我的 HTML 表（该​​行是从克隆表中克隆的）这可能是它不更改名称 attr 的原因）

    <h4>
                        3.3.5 Input Parameters
                    </h4>
                    <table id="input_param" >
                        <thead>
                            <tr>
                                <th>Parameter</th>
                                <th>Data Type</th>
                                <th>Required</th>
                                <th>Brief description</th>
                                <th>Location in Request</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><input type="text" name=":ops1/6/1/1_param" /></td>
                                <td><input type="text" name=":ops1/6/1/1_type" /></td>
                                <td>
                                    <select id="required" name=":ops1/6/1/1_required">
                                        <option value="Mandatory" >Mandatory</option>
                                        <option value="Optional" >Optional</option>
                                        <option value="Conditional" >Conditional</option>
                                    </select>
                                </td>
                                <td><textarea name=":ops1/6/1/1_desc"></textarea></td>
                                <td>
                                    <select name=":ops1/6/1/1_location">
                                        <option value="Header" >Header</option>
                                        <option value="Body" >Body</option>
                                        <option value="Query_param" >Query Parameter</option>
                                        <option value="Resource_uri" >Resource URI</option>
                                    </select>
                                </td>
                            </tr>
                        </tbody>
                    </table>     
                    <input type="button" id="add_input_param" value="+ Add Input Parameter" data-inline="true" /><br />
4

2 回答 2

1 
$('table tr').appendTo('#foo').find('.bar')

在 '#foo' 元素中找不到元素，它会在 'table tr' 中找到分类为 '.bar' 的元素。所以，你的链条不是你想要的。你可以这样写：

var ipCount = 2;
$("#input_form").on("click", "#add_input_param", function() {
    $('#input_param tr').eq(1).clone().find('input').val('').end()
            .appendTo('#input_param > thead')
            .find('#input_param > thead [name]')
            .each(function() {
                $(this).attr('name', 'new_name');
            });
    ipCount++;
});
于 2013-09-17T23:01:38.990 回答
0 
<input type="text" name=":ops1/6/1/1_param" class="ui-input-text ui-body-c">

会是.eq(0)，以及@Murat Çorlu 所说的。

于 2013-09-17T23:37:28.737 回答