HTML的table鼠標拖拽排序該如何完成
發(fā)表時間:2024-05-08 來源:明輝站整理相關軟件相關文章人氣:
[摘要]這次給大家?guī)鞨TML的table鼠標拖拽排序該如何實現(xiàn),用HTML實現(xiàn)table鼠標拖拽排序的注意事項有哪些,下面就是實戰(zhàn)案例,一起來看一下。1.引入文件<script src="js/jquery-1.10.1.min.js"></script> &...
這次給大家?guī)鞨TML的table鼠標拖拽排序該如何實現(xiàn),用HTML實現(xiàn)table鼠標拖拽排序的
注意事項有哪些,下面就是實戰(zhàn)案例,一起來看一下。
1.引入文件
<script src="js/jquery-1.10.1.min.js"></script>
<link rel="stylesheet" href="Public/css/jquery-ui.min.css">
<script src="js/jquery-ui.min.js"></script>
2.給元素附上sortable類
<tbody class="sortable">
<tr></tr>
<tr></tr>
</tbody>
3.開啟并配置
$(function() {
$(".sortable").sortable({
cursor: "move",
items: "tr", //只是tr可以拖動
opacity: 0.6, //拖動時,透明度為0.6
revert: true, //釋放時,增加動畫
update: function(event, ui) { //更新排序之后
var categoryids = $(this).sortable("toArray");
var $this = $(this);
}
});
$(".sortable").disableSelection();
});
相信看了這些案例你已經(jīng)掌握了方法,更多精彩請關注php中文網(wǎng)其它相關文章!
相關閱讀:
HTML圖片的img標簽怎樣使用
HTML里的name與id和class到底有什么不同
如何使用HTML+CSS做出鼠標劃過就可以顯示二級菜單欄
以上就是HTML的table鼠標拖拽排序該如何實現(xiàn)的詳細內容,更多請關注php中文網(wǎng)其它相關文章!
網(wǎng)站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產和維護的網(wǎng)站。