Question

我正在开发一个移动应用程序，因此我将浏览器缩小到适合快速预览的大小。但是现在当我在我的手机上测试它时，水龙头没有在一个div内注册，但它们在另一个div中注册。

这些是div中没有注册点击的两个无响应按钮

<div id="loader">
    <img src="imgs/logo.png">
    <input type="text" placeholder="Email">
    <input type="password" placeholder="Password"><br></br>

    <button id="signup-btn">Sign Up</button>
    <button id="login-btn">Login</button><br>

    <div id="fb_connect">
        <img src="imgs/fb_connect.png">
        <a href="#">Connect with Facebook</a>
    </div>
...
</div>

以下是这些按钮的JQuery

$("#login-btn").click(function (event) {
    $("#loader").hide('slide', {
        direction: 'down'
    }, 250);
    $("#application").fadeIn(250);
});

$("#signup-btn").click(function (event) {
    $("#signup").show('slide', {
        direction: 'down'
    }, 250);
});

https://jsfiddle.net/z469k0n3/

Answer 1

尝试使用jquery的移动点击事件，而不是点击以获得更多兼容性：

  $("#login-btn").bind( "tap", tapHandler );
  $("#signup-btn").bind( "tap", tapHandler2 ); 

  function tapHandler( event ){
    $("#loader").hide('slide', {
        direction: 'down'
    }, 250);
    $("#application").fadeIn(250);
  }

  function tapHandler2( event ){
    $("#signup").show('slide', {
            direction: 'down'
        }, 250);
  }

https://api.jquerymobile.com/tap/

Answer 2

尝试使用jquery mobile的vclick事件。此事件处理程序模拟移动设备上的“onclick”事件处理程序。

$("#login-btn").on("vclick", event, function(event) {
    $("#loader").hide('slide', {
        direction: 'down'
    }, 250);
    $("#application").fadeIn(250);
});
$("#signup-btn").on("vclick", event, function(event) {
    $("#signup").show('slide', {
        direction: 'down'
    }, 250);
});

我希望这可以帮到你！

.click（）无法在移动设备上运行

2 个答案: