應用HTML5原生拖放功能，drop不適用于IE，與chrome和firefox配合使用。
拖動似乎正在起作用，但對IE不感興趣。
另一個小問題 - 在IE中，我的可拖動元素周圍有一個半透明的方塊，但它的背景是透明的(圖像是這樣完成的)，在chrome / firefox上我沒有那個方塊，圖像看起來沒有任何拖動時的背景。
這是下降區域：
這是可拖動的元素：
function drag_start(e)
{
e.dataTransfer.effectallowed = 'copy';
e.dataTransfer.dropEffect = 'copy';
e.dataTransfer.setData("text/plain", e.target.getAttribute('id'));
}
function drag_enter(e) {
if (e.target.getAttribute('data-droppable') == 'true') {
e.target.style.backgroundImage = "url(images/board_cell_background_highlight.png)";
}
function drag_leave(e) {
if (e.target.getAttribute('data-droppable') == 'true') {
e.target.style.backgroundImage = "url(images/board_cell_background.png)";
}
function drag_drop(e) {
var element = e.dataTransfer.getData("Text"); // the player
if (e.preventDefault) {
e.preventDefault();
}
if (e.stopPropagation) {
e.stopPropagation();
}
if (e.target.getAttribute('id') == "player1" || e.target.getAttribute('id') == "player2") {
alert("invalid Move");
return false;
}
e.target.style.backgroundImage = "url(images/board_cell_background.png)";
moveHandler(element, e.target.getAttribute('id'));
}
function drag_end(e) {
e.dataTransfer.effectallowed = 'copy';
alert("drop end")
}
}
}
我刪除了一些打印內容的代碼，以使代碼更短。
