动力学拖放

我在互联网上发现了这段代码，它在Firefox和Chrome上工作正常，但在IE上无法正常工作。任何机构都可以帮助我。这将非常感激。动力学拖放

我已经完成了几乎我的项目，但坚持这一个，请帮助我。

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 

     <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame 
     Remove this if you use the .htaccess --> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 

     <title>drag-and-drop</title> 
     <meta name="description" content=""> 
     <meta name="author" content="Suresh"> 

     <meta name="viewport" content="width=device-width; initial-scale=1.0"> 

     <style type="text/css"> 
      #left{height: 500px;padding: 10px;background-color: #ccc;float: left;width: 215px;margin-top: 10px;} 
      #right{height: 500px;padding: 10px;background-color: #ccc;float: right;width: 680px;margin-top: 10px;} 
     </style> 
     <script src="kinetic-v5.0.1.js"></script> 
     <script defer="defer"></script> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript"> 
      function allowDrop(ev){ 
       ev.preventDefault(); 
      } 

      function drop(ev){ 
       ev.preventDefault(); 
       var data = ev.dataTransfer.getData("Text"); 
       ev.target.appendChild(document.getElementById(data)); 
       //alert("drop"); 
      } 

      function dragStart(ev){ 
       ev.dataTransfer.setData("Text",ev.target.id); 
       //$('#'+ev.target.id).click(); 
       //alert("dragStart"); 
      } 

      function dropcopy(ev){ 
       ev.preventDefault(); 
       var data = ev.dataTransfer.getData("Text"); 
       var copyimg = document.createElement("img"); 
       var original = document.getElementById(data); 
       copyimg.src = original.src; 
       ev.target.appendChild(copyimg); 
       //alert("copy"); 
      } 
     </script> 
    </head> 

    <body> 
     <div id="site_content"> 
      <div id="left" ondrop="drop(event)" ondrag="allowDrop(event)" draggable="true" ondragstart="dragStart(event)"> 
       <ul id="left"> 
        <li><img src="images/template-icon1.png" onclick="javascript: alert('1');" draggable="true" id="drag1" /></li> 
        <li><img src="images/template-icon2.png" draggable="true" id="drag2" /></li> 
        <li><img src="images/template-icon3.png" draggable="true" id="drag3" /></li> 
        <li><img src="images/template-icon4.png" draggable="true" id="drag4" /></li> 
       </ul> 
      </div> 
      <div id="right" draggable="true" ondrop="dropcopy(event)" ondragover="allowDrop(event)">  
      </div> 

      <div id="sidebar_container"> 

      </div> 
     </div> 
    </body> 
</html>

来源

2014-02-22 user1177785

请添加代码源或的jsfiddle – Maksim

非常感谢，我做的是 – user1177785

嗨马克西姆，我在http://jsfiddle.net/khantanveeralam/a33Qt/3/添加了这个代码，但它的一些它不工作呢上jsfiddle.net，所以我已经上传工作代码在http://dgbuzz.com/babyshop-explorer/test/drag-and-drop.html – user1177785

尝试改变ondrag="allowDrop(event)"到ondragover="allowDrop(event)"第一个DIV。还要记住，ID应该是唯一的，这意味着如果您需要多次使用它，那么每页只能使用一个ID，然后使用类。

来源

2014-02-24 13:11:10 Maksim

非常感谢，它正在工作:) – user1177785

@ user1177785如果它解决了这个问题，那么请标记我的回答作为解决方案，谢谢:) – Maksim

回答

相关问题