2

我正在开发一个目前在 iphone 上测试的 phonegap 应用程序。我想做的很简单。我想按下一个按钮，并且只有我正在按下的那个按钮必须被按下。我想防止用户同时按下一个以上的按钮。要根据苹果指南执行此操作，您应该在按下目标按钮时禁用所有其他按钮。我的问题是，如果您最终在完全相同的时间同时按下两个按钮，那么这两个按钮都会被按下。据我所知，javascript 中没有锁，而且我也尝试使用变量作为锁，但它仍然有效。我有这段代码，可以在 iphone 上测试以复制问题。我的问题是你如何编程按钮按下正确的方式？

     <script type="text/javascript" src="plugins/jquery.js"></script>

      <script>

       $(document).ready(function(){

               CreateEvents();
           }); //end ready function

           function CreateEvents()
           {

                 $('.divs').on('touchstart', function(){

               $('.divs').not(this).off();
                  $(this).css('background-color','red');

               });



               $('.divs').on('touchend', function(){

                  $(this).css('background-color','green');
                  setTimeout(function(){
                        CreateEvents();

                        }, 300);

               });


               }
      </script>
<style>
 .divs{
width:200px;
height:200px;
background-color:green;

}
 </style>

</head>
<body>


<div class="divs">
div1
</div>

<div class="divs">
div2
    </div>

</body>
</html>
4

1 回答 1

0

我认为这可能是按下按钮以确保一次只按下一个按钮的正确方法。

   $(".divs").on('touchstart', function(event){
                        event.stopPropagation();
                        event.preventDefault();

                        if(event.handled !== true) {

                                    $('.divs').not(this).off();
                                      $(this).css('background-color','red');

                            event.handled = true;
                        } else {
                            return false;
                        }
                });
            $(".divs").on('touchend', function(event){
                        event.stopPropagation();
                        event.preventDefault();

                        if(event.handled !== true) {

                                     $(this).css('background-color','green');
                                     CreateEvents();

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

然而，重要的是要注意，如果您同时使用触摸事件和鼠标单击事件，某些设备将进行双击，因为它们将触摸注册为单击和触摸事件。这种方法显然也应该防止这种情况发生，但实际上并没有。这被称为“ghostclick”，应该有插件来解决这个问题，但最简单的方法是使用触摸事件或鼠标单击事件。

还是很高兴看到人们如何在您自己的应用程序中管理这些问题的其他示例？

于 2013-03-31T15:01:39.047 回答