拖曳排序

參考網址:

MIS腳印 JavaScript 表格拖放排序 AJAX 資料庫 for PHP 
在FireFox中會有問題,解決方法:
參考網址:Mozilla    Drag and Drop: Copy and Move elements with DataTransfer
javascript中加入function dragstart_handler(ev) 
另外在被拖曳的元素上除了draggable="true"還需加上ondragstart="dragstart_handler(event);"
不加ondragstart在firefox中無法拖曳。
例<tr class="data" draggable="true" ondragstart="dragstart_handler(event);">
目前還有一個問題未解決??(107.11.106更新,關掉手勢擴展就解決了。)
在firefox中拖曳太遠會開啟一個新視窗https://www.google.com/webhp

function dragstart_handler(ev) {
 console.log("dragStart");
 // Change the source element's background color to signify drag has started
//// ev.currentTarget.style.border = "dashed";
 // Add the id of the drag source element to the drag data payload so
 // it is available when the drop event is fired
ev.dataTransfer.setData("text", ev.target.id);
 // Tell the browser both copy and move are possible
ev.effectAllowed = "copyMove";
}

 

107.11.10更新:
firefox 下使用html5拖拽会自动打开新标签的解决办法 (這個方法無效)

另一篇文章:
使用draggable拖动一个图片时,火狐上总会新开一个窗口 (BINGO)
是不是安装了手势操作扩展?拖拽时会在新标签页中打开页面,在工具—附加组件里查看下已经安装的扩展。

 

CSDN h5拖拽在兼容火狐与IE的实现需要注意的事

本篇發表於 程式設計。將永久鏈結加入書籤。