Question

我使用一个函数来克隆带有输入字段的html表行，以允许用户多次输入。

我的 html 看起来像这样

<table id="ID_1">
    <tr id="tr_id1">
        <td><input type="hidden" value="databaseid"/></td>
        <td>Inputfield 1</td>
        <td>Inputfield 2 </td>
    </tr>
</table>
<button onclick="cloneRow('ID_1', 'tr_id1')"></button>

和我的 javascript

function cloneRow(tablename,rowname) {
    var row = document.getElementById(rowname); // find row to copy
    var table = document.getElementById(tablename); // find table to append to
    var clone = row.cloneNode(true); // copy children too
    clone.id = "newID"; // change id or other attributes/contents
    table.appendChild(clone); // add new row to end of table
    $('.pickDate').each(function() {
        $(this).datepicker({ dateFormat: 'dd.mm.yy' });
    }); 
}

对于下一页的进一步工作，我只需要第一个<td><input type="hidden" value="databaseid"/></td>所以通过复制，它应该只复制隐藏的输入，但如果没有值，则值应该看起来像value="" < / p>

如何解决这个问题？（可以使用jQuery）

小提琴http://jsfiddle.net/21sv1bug/

Answer 1

$(row).find('input:hidden').val('')

在函数调用后使用上面的

Answer 2

您可以使用此jQuery代码清空行中输入的值：

$(row).find('input').val('')

Answer 3

试试这个：

function cloneRow(tablename,rowname) {
    var value=$(this).prev('table').find('input:hidden').val(); // store the value in a variable
    $(this).prev('table').find('input:hidden').val(''); // empty the input
    var row = document.getElementById(rowname); // find row to copy
    var table = document.getElementById(tablename); // find table to append to
    var clone = row.cloneNode(true); // copy children too
    clone.id = "newID"; // change id or other attributes/contents
    table.appendChild(clone); // add new row to end of table
    $(this).prev('table').find('input:hidden').val(value); // put the value in its place again
    $('.pickDate').each(function() {
        $(this).datepicker({ dateFormat: 'dd.mm.yy' });
    }); 
}

更新：

使用jQuery Working DEMO ：

$('button').click(function(){
    var clone=$(this).prev('table').find('tr:first').clone();
    clone.attr('id','newID');
    clone.find('input:hidden').val('');
    $(this).prev('table').append(clone);
});

克隆行时清除隐藏的输入

3 个答案: