在表格行中的 div 内插入答案

【问题标题】：Insert inside a div within a table row在表格行中的 div 内插入
【发布时间】：2014-04-13 08:52:24
【问题描述】：

我有一个表格，在交替行中有 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>");
});

【问题讨论】：

那么你的问题是什么，代码正在运行，对吗？

标签： jquery html dynamic html-table

【解决方案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

希望你需要这个！

【讨论】：

[Fiddle](jsfiddle.net/zwHK4/36/) 不适用于多行
是的，它对我有帮助.. 但是如果单击时会加载带有文本框的不同表格，然后将这些值返回到这个所需的 div 表格中......这就是我寻找索引的原因

【解决方案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>");
});

【讨论】：