Question

我有点难过我做错了什么。我的原始想法是为SVG实现平移和缩放功能，为此我需要手势。代码几乎与在任何地方发布的代码相同（以及在MS文档中也是如此）。

目前有问题的HTML（klasse.html）：

<div id="container" style="width:600px;height:600px; background-color:#f00;">
  <svg id="svg" version="1.1" viewBox="0 0 1920 1080" overflow="hidden" preserveAspectRatio="xMinYMin" xmlns="http://www.w3.org/2000/svg">
  </svg>
</div>

请注意，无论是否包含svg-tag，它都没有区别。 div-container诞生于绝望之中（也没有改变任何东西）。

样式表（klasse.css）：

#svg {
  height: 80%;
  width: 85%;
  touch-action: none;
}
#container {
  touch-action: none;
}

最后，脚本本身（klasse.js）：

(function () {
  "use strict";

  WinJS.UI.Pages.define("/pages/klassen_uebersicht/klassen_uebersicht.html", {
    ready: function (element, options) {
        setTarget();
    },
    unload: function () {
    },
    updateLayout: function (element) {
    }
  });
  function setTarget() {
    var msGesture = new MSGesture();
    var elm = document.getElementById("container");

    msGesture.target = elm;
    elm.gesture = msGesture;
    elm.gesture.pointerType = null;

    elm.addEventListener("pointerdown", function (e) { console.log("pointerdown") }, false);
    elm.addEventListener("pointerup", function (e) { console.log("pointerup") }, false);
    elm.addEventListener("pointercancel", function (e) { console.log("pointercancel") }, false);
    elm.addEventListener("lostpointercapture", function (e) { console.log("lostpointer") }, false);
    elm.addEventListener("MSGestureChange", function (e) { console.log("MSGestureChange") }, false);
    elm.addEventListener("MSGestureTap", function (e) { console.log("MSGestureTap") }, false);
    elm.addEventListener("MSGestureEnd", function (e) { console.log("MSGestureEnd") }, false);
    elm.addEventListener("MSGestureHold", function (e) { console.log("MSGestureHold") }, false);
  }
})();

当我使用模拟器时，“正常”指针事件每次都会触发（指针向下，指针，......）MSGesture事件在任何情况下都不会触发，无论使用哪种输入法（标准手指模式，手指模式缩放，...）我正在使用。

那么，我在这里做错了什么？因为Quickstart Documentation没有记录任何进一步的错综复杂，我必须注意。

Answer 1

我认为问题是你没有在MSGesture对象上调用addPointer：

http://msdn.microsoft.com/en-us/library/windows/apps/hh968251.aspx

这是一个在此页面上连接MSGesture事件的完整示例：

http://msdn.microsoft.com/en-us/library/windows/apps/hh968249.aspx

关于MSGesture的有趣之处 - 它实际上只是一个外部元素的奇特状态机。通过从指针向下获取指针ID，然后它在您将其目标属性设置为的目标元素上触发事件，为它提供您关心的指针。

希望有所帮助！

为什么我的WinJS手势不能解雇？

1 个答案: