Question

我有这个拖放代码，除了在iPad上运行良好，任何人都可以给出任何理由吗？

它接缝似乎无法识别它可以被拖动的事实而不是其他任何东西

<span class="draggable" id="drag1" draggable="true" ondragstart="drag(event)">drag</span>
<span class="draggable" id="drag2" draggable="true" ondragstart="drag(event)">drop</span>
<br />
This is a sample 
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
and 
<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
sentence.

JavaScript的：

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.parentNode.replaceChild(document.getElementById(data), ev.target);
        document.getElementById(data).className = "";
      }

Answer 1

您的问题是大多数移动浏览器都不支持HTML5中的“拖放”功能（带有一点JavaScript）。 Click here获取支持的列表。

我建议使用支持所有移动浏览器的替代方法。请参阅此评论并提供更多说明：https://stackoverflow.com/a/9547931/2482557

这可能是您想要查看的内容：jQuery UI Touch Punch

Answer 2

iOS 11最终会正确支持draggable="true"（http://caniuse.com/#feat=dragndrop）。在此之前，对于所有其他设备，您可以使用polyfill，例如 https://www.npmjs.com/package/drag-drop-polyfill 要么 https://github.com/Bernardo-Castilho/dragdroptouch无需调整代码即可插入功能。

JavaScript拖放无法在iPad上运行

2 个答案: