javascript - 如何将 danvk 可重新排序列与动态创建的表一起使用?

标签 javascript html

我正在尝试实现 danvk可拖动表 Javascript,虽然我已经成功地将它用于 html 源中实际的表,但当我尝试将它与我在 Javascript 代码中创建的表一起使用时,它不会应用于这些表。

有人遇到同样的问题吗?

最佳答案

您需要做的就是在注入(inject) table dom 节点后调用 draggable.makeDraggable(tableElement);​​​

考虑以下示例代码:

HTML

​<div id="tableDiv"></div>

JavaScript(最后一行是关键)

var tableStr = '<table id="table" class="draggable" border="1"><tr><th>Name</th><th>Date</th><th>Color</th></tr><tr><td>Dan</td><td>1984-07-12</td><td>Blue</td></tr><tr><td>Alice</td><td>1980-07-22</td><td>Green</td></tr><tr><td>Ryan</td><td>1990-09-23</td><td>Orange</td></tr><tr><td>Bob</td><td>1966-04-21</td><td>Red</td></tr></table>',
    tableDiv = document.getElementById('tableDiv'),
    table;
tableDiv.innerHTML = tableStr;
table = document.getElementById('table');
dragtable.makeDraggable(table);​​​

查看此代码的工作演示 here .

关于javascript - 如何将 danvk 可重新排序列与动态创建的表一起使用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2827767/

相关文章:

javascript - 删除对象上的字段,然后删除从中克隆的对象上的字段

html - 如何在纯CSS中制作自定义复选框和单选按钮?

html - 如何使用 CSS 在 span 中插入换行符?

html - 为什么我的媒体查询不适用?

javascript - fontawesome onclick 图标使用 Material 表更改 Angular

javascript - 专用于文本的幻灯片放映/持续播放/但带有 "back"、 "stop"和 "forward"按钮的图像文件

javascript - 如何使用 Id 数组过滤对象列表 - Angular/TypeScript

javascript - 平滑滚动+按钮 'onclick' 功能

jquery - 检查几个高度并隐藏高元素容器父元素

javascript - 打印时 HTML 表格上没有边框