Question

我有一个表格，在替换行中有div。想在这些div中添加表格。

请检查link并为我更新。

<table>
    <tr>
        <td>hi</td>
    </tr>
    <tr>
        <td>foo 1</td>
        <td>
            <input type="button" value="Remove" id="remove1" />
        </td>
    </tr>
    <tr>
        <td>
            <div></div>
        </td>
    </tr>
    <tr>
        <td>foo 2 </td>
        <td>
            <input type="button" value="Remove" id="remove2" />
        </td>
    </tr>
    <tr>
        <td>
            <div></div>
        </td>
    </tr>
</table>

$("table tr input").on('click', function(e){
    alert($(this).closest('td').parent()[0].sectionRowIndex);
    alert($(this).closest("tr").index()+1);
    var row = $(this).closest("tr").index()+1;
    $('table tr:row').find('div').append("<table><tr><td>hi</td></tr></table>");
});

Answer 1

您必须使用.eq()在该位置插入行并尝试检查div是否存在！
虽然你的问题不太清楚，但还是试试看。

$("table tr input").on('click', function(e){
    var row = $(this).closest("tr").index() + 1; // Get index 
    if($('table tr').eq(row).find('div').length > 0); // Check if alternate row contains div
        $('table tr').eq(row).find('div').append("<table><tr><td>hi</td></tr></table>"); // Append table to div
});

Fiddle Demo

<强>更新

当我们检查div是否存在时，不需要获取行的索引值，您可以直接遍历DOM到预期的div元素。

$("table tr input").on('click', function(e){
    if($(this).closest("tr").next().find('div').length > 0)
      $(this).closest("tr").next().find('div').append("<table><tr><td>hi</td></tr></table>");
});

文档：

next()

find()

Updated Fiddle

希望你需要这个！

Answer 2

如果有多少div作为输入，您可以使用相同的索引：

$("table tr input").on('click', function(e){
    var row = $("table tr input").index(this);
    $("table div").eq(row).append("<table><tr><td>hi</td></tr></table>");
});

在表格行内插入div

2 个答案: