我遇到了 http://jsfiddle.net/Hh8qJ/ 的问题我知道有两个主要问题。其中一个在 Safari(可能还有 Internet Exploder)中不起作用。 Safari 中的选项好像不能做成可拖动对象？同样在 Firefox 中，选项在放下时不会取消选择。这是一个更大项目的一部分，因此我将描述我想要完成的目标以及为什么我冒险走上我所做的道路。因此，我选择了下拉列表，以便可以将元素插入其中或从中插入元素，并且如果需要，可以将项目放在下拉列表中的不同位置。在较大的项目中，只有一个下拉菜单和许多下拉区域 div。这些项目将从下拉菜单中拖到许多放置字段中，但在某些情况下可能需要向后拖动。我不确定是否有更好的方法来做到这一点，但这就是我想到的。我想避免使用 JQuery。
感谢您的帮助!
编辑:HTML 在那里是因为我必须输入一些代码，并且认为没有人想要这里的完整文件。
我将尝试给出一个更简洁的示例来说明如何实际使用它。假设我有 4 个盒子，上面有汽车名称。盒子上写着萨博、沃尔沃、福特和道奇。任务是将所有汽车从下拉区域拖到值得尊敬的下拉区域。然后，如果用户想要将汽车放回下拉菜单中，他们可以将它们从下拉区域拖回下拉菜单中，然后将它们放回到字母顺序中。 (我确实知道现在没有代码可以进行字母顺序化，但我一次尝试一个障碍。)请记住，这是一个非常小的示例，说明我计划如何将其用于更大的项目，这只是我试图使我遇到的问题尽可能简单。
<html>
最佳答案
这是我的解决方案:
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
#div1, #div2
{float:left; width:100px; height:150px; margin:10px;padding:10px;border:1px solid #aaaaaa;}
</style>
<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));
}
function sort(uList)
{
var listItem = document.getElementById(uList).getElementsByTagName('li');
var listLength = listItem.length;
var list = [];
for(var i=0; i<listLength; i++)
list[i] = listItem[i].firstChild.nodeValue;
list.sort();
for(var i=0; i<listLength; i++)
listItem[i].firstChild.nodeValue = list[i];
}
</script>
</head>
<body>
<ul id="div1" ondrop="drop(event)" ondragover="allowDrop(event)" ondragend="sort('div1')">
<li id="list-item3" draggable="true" ondragstart="drag(event)">a</li>
<li id="list-item5" draggable="true" ondragstart="drag(event)">b</li>
<li id="list-item2" draggable="true" ondragstart="drag(event)">c</li>
<li id="list-item4" draggable="true" ondragstart="drag(event)">d</li>
</ul>
<ul id="div2" ondrop="drop(event)" ondragover="allowDrop(event)" ondragend="sort('div2')"></ul>
</body>
</html>
我希望它有帮助:)。我在上面使用了 HTML 5。将一项从一个列表拖到另一个列表后，将调用函数 sort()。该函数将用于对列表中的项目进行排序。我还没有在表单元素上尝试过，但我会看看我能做什么。
关于php - HTML 5 和 Javascript 拖放，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13023903/