【问题标题】:How to detect user touch with phonegap using JS如何使用 JS 检测带有 phonegap 的用户触摸
【发布时间】:2011-01-28 08:28:24
【问题描述】:

我正在使用 phonegap 构建 Android 应用程序。

我想检测用户的触摸事件,以便弹出警报。但是,如何从 javascript 调用 ontouch 事件?

谢谢!

【问题讨论】:

    标签: javascript android touch cordova


    【解决方案1】:

    下面是显示touchstarttouchend 的示例。它演示了附加触摸事件的两种不同方式:元素属性或 JavaScript 的 addEventListener

    由于它正在侦听触摸事件,因此这些事件不会在桌面浏览器(支持鼠标事件)上触发。要测试该页面,您可以在 Android 或 iOS 模拟器中打开它。

    <!DOCTYPE html>
    <html>
      <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0;" />
        <style type="text/css">
          a {
            color:black;
            display:block;
            margin:10px 0px;
          }
        </style>
    
        <script type="text/javascript">
          function onload() {
            document.getElementById('touchstart').addEventListener('touchstart', hello, false);
            document.getElementById('touchend').addEventListener('touchend', bye, false);
          }
    
          function hello() {
            alert('hello');
          }
    
          function bye() {
            alert('bye');
          }
        </script>
    
        <title>Touch Example</title>
      </head>
      <body onload="onload();">
        <h1>Touch</h1>
        <a href="#" ontouchstart="hello();return false;">Attribute: ontouchstart</a>
        <a href="#" ontouchend="bye();return false;">Attribute: ontouchend</a>
        <a href="#" id="touchstart">addEventListener: touchstart</a>
        <a href="#" id="touchend">addEventListener: touchend</a>
      </body>
    </html>
    

    【讨论】:

    • @mwbrroks 我已经尝试过,它与链接/按钮配合得很好。但是我想知道它是否可以在没有任何链接或按钮的空白屏幕上工作。这意味着只要用户触摸屏幕上的任何位置,它就会显示一个弹出窗口。可能吗? :) 谢谢
    • 做一个window.addEventListener(etc)
    • 虽然没有完全解决,但你的回答给了我一些启动的方向。但是现在还有一个问题,那就是键盘出现了,当我触摸它的键时,它突然消失了。我该如何解决这个问题?
    • 获取 jquery mobile 以访问来自 jquery 的不同触摸事件
    猜你喜欢
    • 1970-01-01
    • 2010-11-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-12-12
    • 2014-05-11
    相关资源
    最近更新 更多