如何防止文档正文上的单击事件(可能是 Cordova 中的错误?) [英] How to prevent click events on the document body (maybe a bug in Cordova?)
问题描述
我是一名初学者，正在尝试使用 Kinetic Js 和phonegap build"开发一款手机游戏.我遇到了一个我不知道如何解决的问题.我做了一些测试:
I'm a beginner trying to develop a mobile phone game with with Kinetic Js and "phonegap build". I am experiencing a problem which I don't know how to address. I made some tests:
我刚刚将这段代码粘贴到我的 index.html 并将代码发送到 phonegap build，它从 html 代码创建了 apk 文件.该应用程序运行良好，但如果您稍微玩一下，您可能会看到一个不受欢迎的行为:可以通过触摸点击整个舞台"，当它发生时(实际上并不容易故意这样做，但它发生了)你听到 android 操作系统的标准点击声，您会看到整个区域突出显示一秒钟.就像您在浏览器中点击链接一样.
I just pasted this code here into my index.html and sent the code to the phonegap build which created the apk file from the html code. The app works quite fine but if you play a little bit you may see an undesired behavior: the entire "stage" can be clicked with a touch and when it happens (it's actually not easy to do it on purpose, but it happens) you hear the standard click sound of the android OS and you see the entire area highlighted for a second. Just like if you were in a browser and you clicked on a link.
我编译了(使用 phonegap build)链接到这里的指南针模拟器，它可以工作，但是当您点击指南针的图片时，您会触发咔嗒声.这是一种不希望的效果，如果您在浏览器/模拟器上运行它，则不会出现这种效果.
I compiled (with phonegap build) the compass simulator linked here, it works but when you tap the pic of the compass you trigger the click sound. This is an undesired effect which is not present if you run it on a browser/emulator.
我只是在 body 中放了一些 png 图像，避免了 canvas 和 KineticJs.我也没有添加任何脚本.在这种情况下，点击时没有点击事件.但是如果我添加
I just put some png image in the body avoiding canvas and KineticJs. I also didn't add any script. In this case there is no click event when you tap. But If I add
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
(即使没有添加任何脚本)然后再次点击可以产生点击事件.如果我删除两行中的任何一行，则单击事件就会消失.另外如果我添加
(even without adding any script) then again tap can produce the click event. If I remove anyone of the two lines then the click event disappear. Also if I add
<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.5.4.min.js"></script>
再次，身体是可点击的，产生高光和点击声音.(我仍在谈论使用 phonegap build 编译的应用程序).
again the body is clickable producing highlights and click sound. (I'm still speaking about the compiled app with phonegap build).
我尝试将 替换为 但没有帮助.我还尝试使用 $("#object").click( function () {return false;}) 和画布的 div 元素，图片和正文，也没有帮助.我寻找了使锚点不可点击的建议，以查看它们是否可以应用，但我没有发现任何有用的东西.
I tried replacing <body> with <body onmousedown="return false;"> but didn't help. I also tried with $("#object").click( function () {return false;}) with the div element of the canvas, the pic and the body, didn't help either. I looked for advises to make anchors not clickable to see if they could be applied but I didn't find anything useful.
有什么建议吗?
更新:另一个没有解决的尝试是:stage.off('tap click mousedown touchstart touchend dbltap');.
Update: Another try which didn't solve is: stage.off('tap click mousedown touchstart touchend dbltap');.
推荐答案
你试过了吗?
stage.on('tap touchstart touchend', function() {
return false;
});
这也可能有帮助:
canvas {
/*-webkit-tap-highlight-color: transparent; Some users reported this worked for them, although rgba(0,0,0,0); worked for the asker*/
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
outline: none;
}
这是关于 webkit-touch-callout 的快速链接，我不确定它是否对您的情况有帮助... http://phonegap-tips.com/articles/essential-phonegap-css-webkit-touch-callout.html
Here is a quick link on webkit-touch-callout, I'm not sure if it will help your situation... http://phonegap-tips.com/articles/essential-phonegap-css-webkit-touch-callout.html
看来电话间隙的作者建议 -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 以防止链接选择.来源:https://github.com/phonegap/phonegap-start/blob/master/www/css/index.css
It appears the author of phone gap suggests -webkit-tap-highlight-color: rgba(0, 0, 0, 0); to prevent link selection. Source here: https://github.com/phonegap/phonegap-start/blob/master/www/css/index.css
这篇关于如何防止文档正文上的单击事件(可能是 Cordova 中的错误?)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
