3
我有一個問題,即在不同的select元素內部的選項元素拖放到谷歌瀏覽器中工作。在選擇元素(Google Chrome)中拖放
這是我的jsfiddle(在Firefox正常工作): http://jsfiddle.net/DyAXf/1/
,代碼:
<script>
function allowDrop(ev)
{
ev.preventDefault();
}
function drag(ev)
{
ev.dataTransfer.setData("Text",ev.target.id);
}
function drop(ev)
{
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>
<table style="text-align: left; width: 100%;">
<tbody>
<tr>
<td></td>
<td>
<form>
<select id="taglist1" class="tagdiv" name="taglist1" size=7 ondrop="drop(event)" ondragover="allowDrop(event)">
<option id='giessen' class="dragElement" draggable="true" ondragstart="drag(event)" value="option1">giessen</option>
<option id='giessen2' class="dragElement" draggable="true" ondragstart="drag(event)" value="option2">giessen2</option>
<option id='giessen3' class="dragElement" draggable="true" ondragstart="drag(event)" value="option3">giessen3</option>
<option id='giessen4' class="dragElement" draggable="true" ondragstart="drag(event)" value="option4">giessen4</option>
<option id='giessen5' class="dragElement" draggable="true" ondragstart="drag(event)" value="option5">giessen5</option>
<option id='giessen6' class="dragElement" draggable="true" ondragstart="drag(event)" value="option6">giessen6</option>
</select>
<select id="taglist2" class="tagdiv" name="taglist2" size=7 ondrop="drop(event)" ondragover="allowDrop(event)"></select>
</form>
</td>
</tr>
<tr>
<td></td>
<td>
<form action="game.php" method="post">
<input class="uibutton" type="submit" value="Submit" />
</form></td>
</tr>
</tbody>
</table>
的原因,我需要選擇的元素是因爲我想知道至極條款是至極在表單被觸發後選擇元素。 它的某種排序,我想知道哪些術語堆疊在一起。有沒有更好的解決方案來處理這個問題?我的代碼有問題嗎?
在此先感謝。