2

我正在为 Win8(特别是 Surface 平板电脑)上的触摸事件的小画布元素进行故障排除。显然它适用于鼠标或触控笔,但不适用于触摸。我无法使用 Win8 触摸设备进行测试,因此我正在尝试对此进行研究,但没有提出任何明确的建议。

这是实际页面(使用临时 URL,因此该网站不会在 Stack Overflow 档案中臭名昭著,哈哈):http ://www.urlgone.com/e8e1c2/

最简单的修复似乎是将“MSPointerDown”添加到 jQuery on() 函数中,但客户端表示行为没有变化。

我想我的问题是,jQuery 是否将“MSPointerDown”识别为事件?如果是这样,那么我的问题可能不是函数触发器,而是其他问题......

或者它可能是针对一个画布对象?我正在使用 Kinetic.js 库,这是我第一次使用画布动画。

编辑:我想我在这里发布了错误的代码,所以这就是我现在的位置。

所以,获取触摸/点击/指针事件的对象是这样的:

        var triangle = new Kinetic.Image({
            image: images[key],
            x: tri.x,
            y: tri.y,
            detectionType: "pixel"
        });

这就是我试图触发它的方式。对于正常的“点击”事件,我看到使用 jQuery 的 .on() 绑定它可以正常工作,但是当我尝试在三角形上使用addEventListener正常点击。

            triangle.on("mousedown touchstart click", activateTriangle);
            /*
            // I popped this in here to see if it would work, assuming that if it 
            // doesn't work for clicks, it won't work for pointer events.
            // This gives me the error, 
            // Uncaught TypeError: Object #<Object> has no method 'addEventListener' 
            triangle.addEventListener('click',function(){
                window.console && console.log('click event');
            });
            // And here's what I get for trying to iterate through it
            // Uncaught TypeError: Object #<Object> has no method 'addEventListener' wealth-management.php:305
            //  (anonymous function) wealth-management.php:305
            //  e.extend.each jquery-1.7.2.min.js:2
            //  e.fn.e.each jquery-1.7.2.min.js:2
            //  (anonymous function) wealth-management.php:304
            //  initStage wealth-management.php:318
            //  images.(anonymous function).onload
            $(triangle).each(function(){
                this.addEventListener('click',function(){
                    window.console && console.log('hi');
                });
            });
            */  
        /* Try for IE10 Touch */                
        if (window.navigator.msPointerEnabled) {
                window.console && console.log('msPointerEnabled');
                // click to correct info window
                //triangle.on("MSPointerDown",activateTriangle); 
                triangle.addEventListener("MSPointerDown", activateTriangle, false);
        }   

如果我可以让 addEventListener 使用“click”,我可以在没有 Win8 触摸设备的情况下进行测试,我假设带有“MSPointerDown”的 addEventListener 也可以工作。那个听起来是对的吗?如何将 eventListener 附加到 Kinetic.js 对象?

编辑

我无法让它工作,所以我有一个画布元素的图像映射,它在浏览器检查 IE8 或“MSPointerDown”后被替换。因此,具有讽刺意味的是,canvas 元素可以在 IE9 中工作,但不能在 IE10 中工作。那好吧。

4

1 回答 1

1

我了解您正在使用 jQuery。我在尝试捕获输入事件坐标时遇到了类似的问题。jQuery 和事件的问题在于它从系统中合成和清理了自己的事件对象,这在大多数情况下是可以的。然而,最初编写 jQuery 时没有触摸事件,因此它没有捕获它们的代码。

MSPointer 事件确实可以通过,但它生成的 $evt 结构中没有坐标信息。

您可以在事件侦听器中做的一件简单的事情是使用 $evt.originalEvent ,其中包含传递给 jQuery 的原始事件的数据。

在微软担心的地方,他们像往常一样走自己的路,将事件称为“MSPointerDown”、MSPointerMove 等……你会为每个手指获得一个事件 WHATWG 方法是在事件结构中使用一系列接触点。

于 2013-03-22T09:48:41.613 回答