Javascript HTML5基本拖放功能不适用于FF中的输入按钮

编辑：

FF

的问题似乎是我试图使

input type=“button”

my

draggable

元素。有什么办法可以让它发挥作用吗？或者我需要将所有内容从

input

更改为

div

？我真的需要将

输入的
值
部分用于我的游戏互动程序。也许可以用包含
拖动
元素的
div
容器包装
输入的每个实例

我正在做一个简单的游戏，包括拖动瓷砖到游戏空间。在
Chrome
和
IE
中，一切都可以正常工作，但在
FF
中则不行。这个问题似乎在论坛上得到了很多解决，但我尝试的每一个解决方案都一事无成。此问题似乎发生在代码的拖动部分。当拖动发生时，我会启动一个
console.log（）
，但在
FF
中我甚至没有得到它

谢谢你的帮助。以下是示例和演示：

CSS:

HTML:

对于可能有此问题的任何人；问题围绕着这样一个事实：我试图将
draggable
属性赋予
input
元素
FF
不喜欢这样，而
Chrome
和
IE
似乎对此漠不关心（它起作用了）。所以我不得不回去修改我所有的代码，去掉
input
元素，并将它们全部更改为常规
div
。这修复了可拖动的
问题

.tileBtn{
    color: #fff !important; 
    background-color: #e07171;
    cursor:pointer;
}
.gameBtns{
    margin:10px 10px;
    padding:10px; 
} 
.gameTileOpen{
    background-color: #fff;
    color: #000;
    border: 1px solid #699fc5; 
}

<div id="gameTiles">
    <input type="button" class="tileBtn gameBtns" draggable="true" value="Game Tile" ondragstart="dragTile(event)">
</div>  
<div id="gameBoard" ondragover="allowDrop(event)">
    <input type="button" class="gameTileOpen gameBtns" draggable="true" value="Open Space" ondragstart="dragTile(event)" ondrop="dropTile(event)">
</div>

//allow player to drop game tiles in game area
function allowDrop(mouseEvent) {
    mouseEvent.preventDefault();
};
//drag function
function dragTile(mouseEvent) {
    console.log("this is firing");
    var tileId = mouseEvent.target.id;
    var tileValue = mouseEvent.target.value;
    var x = {tileId:tileId, tileValue:tileValue};
    var j = JSON.stringify(x);
    mouseEvent.dataTransfer.setData("text", j);
    mouseEvent.dataTransfer.effectAllowed = "move";        
};
//drop function
function dropTile(mouseEvent) {     
    mouseEvent.preventDefault();
    //get data from space that player is leaving
    var data = JSON.parse(mouseEvent.dataTransfer.getData("text")); 
    var playedId = parseInt(data["tileId"]);
    var playedValue = data["tileValue"];
    mouseEvent.target.setAttribute('value', playedValue);
    mouseEvent.target.setAttribute('class', "tileBtn gameBtns");
    mouseEvent.target.draggable = "true";
};