Javascript 在 windows phone 7.5 中拖放答案

【问题标题】：Javascript Drag and drop in windows phone 7.5Javascript 在 windows phone 7.5 中拖放
【发布时间】：2012-11-10 05:00:29
【问题描述】：

我正在尝试让拖放功能在 Windows 7.5 手机中工作。最初我尝试使用可在除 Windows 7.5 之外的所有浏览器中使用的 jquery ui 可拖动。后来进一步探索，我发现windows中没有touchstart、touchend和touchmove事件。所以我尝试使用mousedown，mousemove事件让它工作，这些事件令人震惊地触发了。但它们没有按正确的顺序开火。（mousemove 在 mousedown 之前触发）。 dragstart 和 dragend 事件也不起作用。我需要让它工作。你有什么建议吗？

/*Eg1:does not work*/
$("#draggable").draggable(); 

/*Eg2:This event does not fire*/
 $("#draggable").bind("touchstart touchmove touchend", function(){
alert("touch events supported");})

/*Eg3: In this case, mousemove fires before mousedown.*/
$("#draggable").bind("mousedown", function(){
alert("mousedown");});

$("#draggable").bind("mousemove", function(){
alert("mousemove");});

【问题讨论】：

你应该给出你正在做什么的代码示例，而不仅仅是文本描述。通过提供代码示例，人们将更有可能帮助您并找到答案

标签： javascript html windows-phone-7

【解决方案1】：

我只有在使用 IE 10（与 WP7.5 和 WP7.8 中的 IE 9 不同）的 Windows Phone 8 中使用 Javascript 的经验，但您可以试试我的方法。

在 WP8 (IE10) 中，Microsoft 支持 pointer 事件 MSPointerUp MSPointerMove MSPointerDown 而不是 touchstart、touchmove 和 touchend 事件。尝试使用这些来查看它们是否有效。

然而，在我创建的示例中，我确实不需要甚至需要使用那些专有事件，因为 IE 10 很乐意使用标准鼠标事件 (mouseup mousemove mousedown) 和在一定程度上运作良好。我对事件的顺序没有任何问题（就像你在问题中所说的那样）。拖动时出现的主要问题是mousemove 事件停止被触发（由浏览器），而浏览器开始平移页面，使我拖动的元素处于不确定状态（没有mousemove 或mouseup 触发） .使用event.preventDefault() 也无济于事，因为它不会阻止页面平移。为了克服这个问题，我浏览了微软关于他们的触摸事件的文档并遇到了这个 CSS 行。

-ms-touch-action: none;

我将它应用到要拖动的元素上，我的问题就解决了。您可以阅读有关上述专有 CSS 属性 here 的所有信息。注意不要将此属性应用于页面的整个body（我之前已经这样做过），因为它会阻止页面平移和缩放的默认浏览器行为。正如我所说，仅将其应用于要拖动的元素并且它可以工作。

这又是我对 WP 8 的体验。我确实不知道它是否适用于以前版本的 Windows Phone。

【讨论】：