jQuery touchend事件阻塞（使用Cordova）

I used a listener on mousedown and mouseup to react differently if it was going from one canvas to one another. On website, perfect. But it must be mobile, so to make it work I went with touchstart and touchend event.

我在mousedown和mouseup上使用了一个监听器,如果从一个画布到另一个画布,则会有不同的反应。在网站上,完美。但它必须是移动的,所以为了使它工作我去了touchstart和touchend事件。

And it doesn't work as expected.

它没有按预期工作。

Here are some code :

这是一些代码:

HTML (it is simply a left side canvas and right side canvas)

HTML(它只是一个左侧画布和右侧画布)

<canvas class="left" style="position: relative; background-color: #FFF; width: 45%; height: 80px;"></canvas><canvas class="right" style="position: relative; background-color: #FFF; width: 45%; height: 80px;"></canvas>

JS

$('canvas').on("touchstart", function(e) { //mousedown for mobile
    console.log('CONSOLE: start ' + this.className);
    down = this;
});
$('canvas').on("touchend", function(e) { //mouseup for mobile
    console.log('CONSOLE: end ' + this.className);
    calc(down, this);
});
function calc(press, depress) {
    code...
}

I used ADB Logcat to debug and here is the unexpected behaviour.

我使用ADB Logcat进行调试,这是意外的行为。

I/chromium(28808): [INFO:CONSOLE(148)] "CONSOLE: Reinitialized", source: file:///android_asset/www/js/share.js (148)
I/chromium(28808): [INFO:CONSOLE(21)] "CONSOLE: start left", source: file:///android_asset/www/js/share.js (21)
I/chromium(28808): [INFO:CONSOLE(25)] "CONSOLE: end left", source: file:///android_asset/www/js/share.js (25)
I/chromium(28808): [INFO:CONSOLE(21)] "CONSOLE: start left", source: file:///android_asset/www/js/share.js (21)
I/chromium(28808): [INFO:CONSOLE(25)] "CONSOLE: end left", source: file:///android_asset/www/js/share.js (25)
I/chromium(28808): [INFO:CONSOLE(21)] "CONSOLE: start right", source: file:///android_asset/www/js/share.js (21)
I/chromium(28808): [INFO:CONSOLE(25)] "CONSOLE: end right", source: file:///android_asset/www/js/share.js (25)
I/chromium(28808): [INFO:CONSOLE(21)] "CONSOLE: start right", source: file:///android_asset/www/js/share.js (21)
I/chromium(28808): [INFO:CONSOLE(25)] "CONSOLE: end right", source: file:///android_asset/www/js/share.js (25)

So what did I do for this.

那么我为此做了什么。

Reinitialized is simply a reset to clean stage.

重新初始化只是重置清洁阶段。

The first two lines "start left end left" is simply a tap in the left side canvas.

前两行“左起始”只是左侧画布中的一个水龙头。

Then, the next two lines are "start left end left" too. BUT here, I slided from left canvas to right canvas, without getting the expected "start left end right". Same goes for right.

然后,接下来的两行也是“左开始”。但是在这里,我从左画布滑到右画布,没有得到预期的“从右开始”。同样适合。

I also use Cordova (for hybrid HTML5 apps) on a Android 5.0 Lollipop Moto G (2nd Gen) phone.

我还在Android 5.0 Lollipop Moto G(第二代)手机上使用Cordova(用于混合HTML5应用程序)。

What is the problem?

问题是什么?

1 个解决方案

#1

I corrected this issue by using touchmove event with elementFromPoint()

我通过使用elementFromPoint()的touchmove事件更正了此问题