javascript - onclick 事件在移动设备上的函数内部不起作用?

标签 javascript jquery twitter-bootstrap jquery-mobile

这是我的内联 onclick 事件。当以这种方式编写时,它可以在移动设备和 PC 上运行:

<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.5/paper/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz|Open+Sans+Condensed:300|Limelight">
<script src="https://code.jquery.com/jquery-2.0.0.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
   <form class="form-inline" method="post" action="">
   <span><a id="sp-login" style="cursor:pointer;">Login Here</a></span>
   <span> or <a id="sp-signup" style="cursor:pointer;">Create an Account</a></span>
   <input class="form-control" style="width:100%;display:none;" type="text" name="username" id="in-user" placeholder="Username" type="text"/>
   <input class="form-control" style="width:100%;display:none;" type="password" name="password" id="in-pass" placeholder="Password"/>
   <input class="form-control" style="width:100%;display:none;" type="email" name="email" id="in-email" placeholder="your@email.com (For Unique Key)"/>
   <button type="submit" name="submit" value="login" class="btn btn-sm btn-info" style="display:none;width:210px;" id="in-login">Login</button>
   <button type="submit" name="submit" value="register" class="btn btn-sm btn-warning" style="display:none;width:210px;" id="in-signup">Sign Up</button>
   </form>
   <script>
   $(document).ready(function() {
       $('#sp-login').on('click touchstart', function() {
         $('#in-user').show(); $('#in-pass').show(); $('#in-login').show(); $('#in-email').hide(); $('#in-signup').hide();
     }); 

       $('#sp-signup').on('click touchstart', function() {
         $('#in-user').show(); $('#in-email').show(); $('#in-signup').show(); $('#in-pass').show(); $('#in-login').hide();
     });
   });
   </script>

它仅适用于 PC,不适用于移动设备。

我的 jQuery 版本是 2.0.0。如果它发生任何变化,我正在使用 Bootstrap 版本 3.3.5。

最佳答案

请尝试这个:

$(document).on('touchstart click', '.myBtn', function(event){
        event.stopPropagation();
        event.preventDefault();
        if(event.handled !== true) {

            // Do your magic here.

            event.handled = true;
        } else {
            return false;
        }
});

关于javascript - onclick 事件在移动设备上的函数内部不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32173436/

相关文章:

html - Bootstrap移动端断点展开nav

Javascript (ES6) 模块 : Is it possible to export a variable with a dynamic name?

javascript - 多组间隔脚本

javascript - 动态修改 HighChart 布局选项

jquery - 在 ajax 请求后调整容器 div 的大小

javascript - jquery检测文本变化

javascript - 正则表达式不接受单个字符

javascript - Js key 限制但有点怜悯?

twitter-bootstrap - 为什么 Bootstrap 的容器类有填充,而行类有负边距来补偿填充

html - 在屏幕底部对齐导航栏 - Bootstrap