Question

我认为标题非常自我解释。我有许多从PHP代码生成的div，从数据库中获取产品。问题是当我在两个容器（也是div）之间拖动它时，我不能将它们全部返回到第一个容器，因为产品div id是相同的，并且它从容器1重复 - ＆gt; 2，而不是从容器2向后 - > 1.（2个容器，所有产品div都有相同的ID）。我可以通过在产品的div ID中添加+1来解决这个问题（所以他们有不同的id），但这样我就不能使用css中的id了。有解决方案吗这是js代码

<script type="text/javascript">
            function allowDrop(ev){
                ev.preventDefault();
                }
            function drag(ev){
                ev.dataTransfer.setData("Text",ev.target.id);
                }
            function drop(ev){
                if (ev.target.id == "container"){
                var data=ev.dataTransfer.getData("Text");
                ev.target.appendChild(document.getElementById(data));
                ev.preventDefault();
                }}
        </script>

提前致谢

Answer 1

您不能拥有两个具有相同ID的div。尝试使用类。

您的drop()函数应该是这样的：

function drop(ev){
   if ( ev.hasClass('container') ) {
            // do some stuff
   }
}

您可以使用jQuery .addclass()方法动态添加类。

Answer 2

ID必须是唯一的，才能使HTML有效。当您复制ID时，会发生奇怪的事情。即使你设法让它在一个浏览器中运行，其他人也可能以不同的方式处理事情。您可以尝试使用类。

Answer 3

我通过使用增加的id为php生成的div解决了这个问题。怎么也不是我想要的解决方案之一。谢谢你试图帮助

html5拖放具有相同ID的div

3 个答案: