jquery将新元素插入表格单元格而不删除其他元素

Question

表格包含多行，每行有四个单元格。

在带有 id=tdJane 的单元格中，我已经有两个输入元素:

<table>
    <tr>
        <td id="tdBob">
            <input type="hidden" id="hida" value="some stuff">
            <input type="hidden" id="hidb" value="other stuff">
        <td>
        <td id="tdJane">
            <input type="hidden" id="hid1" value="some text">
            <input type="hidden" id="hid2" value="other text">
        <td>
    </tr>
</table>

在单元格#tdJane中，我希望在#hid2下面插入一个新的隐藏输入字段

我试过这个:

$('#tdJane').html('<input type="hidden" id="hid3" value="newest text">') 

但这会覆盖单元格的现有内容。

我该怎么做？

Answer 1

您需要使用.append() , .html() 将覆盖内容。

$('#tdJane').append('<input type="hidden" id="hid3" value="newest text">');

为了更加清晰，您可以使用 jquery 元素构造函数。

 $('#tdJane').append($('<input/>',{type:'hidden',
                                   id: 'hid3',
                                   value:'newest text'}));

查看此中的 View 源 Demo