tablednd保存 php,TableDnD-JavaScript中文网-JavaScript教程资源分享门户
TableDnD是什么
什么是TableDnD,jQuery plug-in to drag and drop rows in HTML tables
TableDnD官網(wǎng):官網(wǎng)
TableDnD文檔:文檔
TableDnD源碼倉(cāng)庫(kù):源碼倉(cāng)庫(kù)
TableDnD下載地址:點(diǎn)此下載 點(diǎn)此下載2
TableDnD介紹、TableDnD使用
Installation
TableDnD is easy to install:
npm install --save tablednd
or
yarn add tablednd
or
bower install https://github.com/isocra/TableDnD.git
Alternatively you can simply reference from CDNJS:
or
You'll also need to include jQuery before you include this plugin (so that jQuery is defined).
Getting Started
Let's create a simple table. The HTML for the table is very straight forward (no Javascript, pure HTML, we haven't added thead or tbody elements, but it works fine with these too):
| 1 | One | some text |
| 2 | Two | some text |
| 3 | Three | some text |
| 4 | Four | some text |
| 5 | Five | some text |
| 6 | Six | some text |
To add in the "draggability" all we need to do is add a line to the $(document).ready(...) function as follows:
$(document).ready(function() {
// Initialise the table
$("#table-1").tableDnD();
});
Basically we get the table element and call tableDnD. If you try this, you'll see that the rows are now draggable.
In the example above we're not setting any parameters at all so we get the default settings. There are a number of parameters you can set in order to control the look and feel of the table and also to add custom behaviour on drag or on drop. The parameters are specified as a map in the usual way and are described the full documentation:
You can also play and experiment with TableDnD using this jsFiddle. Here you get the documentation, plus live examples.
總結(jié)
以上是生活随笔為你收集整理的tablednd保存 php,TableDnD-JavaScript中文网-JavaScript教程资源分享门户的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: h5 表单居中_3分钟学会易企秀H5操作
- 下一篇: 用php打出2020年是庚子鼠年,202