Javascript 如何将另一个子项添加到响应数据表

如何将另外两个子项添加到响应数据表中

如果表格太窄，我单击+按钮，则此操作无效

有什么想法吗

function format ( d ) {
    return '<div class="player"></div>';
}

---

这似乎是可行的，但它不会创建另一行，而只是将您指定的div添加到创建的行中：

"responsive": {
    "details": {
        "renderer": function ( api, rowIdx ) {
            // Select hidden columns for the given row
            var data = api.cells(rowIdx, ':hidden').eq(0).map(function(cell){
                var header = $(api.column(cell.column).header());
                return $("<tr></tr>").append($("<td></td>",{
                    "text": header.text()+':'
                })).append($("<td></td>",{
                    "text": api.cell( cell ).data()
                })).prop('outerHTML');
            }).toArray().join('');
            return data ?
                $('<table/>').append( data ).prop('outerHTML') + $("<div></div>", {"class":"player"}).prop('outerHTML') :
                false;
        }
    }
},

---

作为一个例子，感谢你的挑战，我很高兴了解这一点-

您可以使+图标始终保持不变如果您将其中一列隐藏，您可以为此创建一个虚拟列，并使用响应插件none中的一个作为该虚拟列的“className:”none“

在下面的示例中，我使用了最后一列，因为在行详细信息中，它也将显示在最后

然后，在枚举中的列时，如果特殊列标题与我使用的某个预定值“Extra 10”（最后一列的标题）匹配，则可以显示该列所需的内容

请参见此演示

---

PS：我用这个答案作为基础，所以我的选票也投给了他。

我看了小提琴，期望的结果是什么？我想在响应区域的末尾添加div。因此，我只需要一个按钮。请确保调整桌子的大小，使其非常窄。我真正需要的是创建一个孩子，即使当响应插件被激活时，这是一个聪明的插件。因此，如果表格行太短，无法显示所有数据，则第一个单元格会得到一个加号，单击该加号时，会使另一个单元格下降到可见状态，而被截断的单元格位于？明亮的我想为了得到你想要的东西，你需要进入插件脚本并添加到其中。看起来，从源代码看，你可以改变插件的渲染器功能，也许这是最好的地方？你知道吗？这似乎不是一件容易的事：这是我首选的解决方案。但是，当表格没有被压缩时，这是不起作用的，因为+按钮消失了。如果是这样，我认为最好使用不同的解决方案，而不是响应插件。在您最初的JSFIDLE中，当您压缩表格时，绿色图标变为可见，并且您在第一个单元格上的渲染意味着有时图标在子行中可见。我是否可以强制响应按钮保持在那里，即使表格未压缩，我不这么认为，如果不深入研究底层的插件代码，那么这可能不是一个好主意，因为做其他事情可能会得到更好的结果。这看起来对你有用：这是我在上面的JSFIDLE中使用的一个：我可以通过某种方式打开单击该行的孩子吗？啊，谢谢@Gyrocode.com我没有记录className:none选项