jQuery移动点击事件触发两次 [英] jquery mobile click event fires twice

问题描述

我有一个简单的JQuery移动应用程序的问题。这一切归结为点击事件发射两次。

无法解决类似问题已解决此问题。

无论是部署到设备还是在浏览器中显示，都会出现问题。

这是代码

$ b

 < title>< / title> 
 
< meta http-equiv =Content-Typecontent =text / html; charset = utf-8/> 
< meta name =viewportcontent =width = device-width，user-scalable = no/> 
 
< script src =jquery-1.8.2.min.jstype =text / javascript>< / script> 
< script src =jquery.mobile-1.2.0.min.jstype =text / javascript>< / script> 
< script src =cordova-2.2.0.jstype =text / javascript>< / script> 
 
< script type =text / javascript> 
 $（document）.bind（mobileinit，function（）{
 $ .support.cors = true; 
 $ .mobile.allowCrossDomainPages = true; 
}）; 
< / script> 
 
< link rel =Stylesheethref =jquery.mobile-1.2.0.min.css/> 
  

 < div> 
< input type =buttonid =ButtonSubmitvalue =Save/> 
< / div> 
  

 < script type =text / javascript> 
 
 
 $（＃ButtonSubmit）click（function（）{
 alert（'Clicked'）; 
}）; 
 
< / script> 
  

解决方案

解除绑定，然后使用 > bind 如下 ：

>

$（＃ButtonSubmit）。unbind（'click'）。bind（'click'，function（）{
alert（'Clicked'）;
return false ; //以防止浏览器实际跟踪链接！
}）;

< / script>

更新：如果您 >方法，然后你可以使用如下。

注意：当你使用关方法时，它会删除以前的点击事件处理程序，强>开方法，它添加新的一个。它不允许发生点击2次。

 < script type =text / javascript> 
 
 $（'＃ButtonSubmit'）。off（'click'）。on（'click'，function（）{
 
 alert（'Clicked'）; 
 return false; //阻止浏览器实际跟踪链接！
}）; 
 
< / script> 
  

I have a problem with a simple JQuery mobile app. It all boils down to the the click event firing twice.

No solution to similar problem has resolved this issue.

The problem happens whether deploying to device or displaying in browser.

Here's the code

<title></title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />

<script src="jquery-1.8.2.min.js" type="text/javascript"></script>  
<script src="jquery.mobile-1.2.0.min.js" type="text/javascript"></script>
<script src="cordova-2.2.0.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).bind("mobileinit", function () {
        $.support.cors = true;
        $.mobile.allowCrossDomainPages = true;
    });
</script>

<link rel="Stylesheet" href="jquery.mobile-1.2.0.min.css" />

<div>
    <input type="button" id="ButtonSubmit" value="Save" />
</div>

<script type="text/javascript">


    $("#ButtonSubmit").click(function () {
        alert('Clicked');
    });

</script>

解决方案

You can solve that by using below mentioned way.

Use firstly unbind and then bind like below :

<script type="text/javascript">

    $("#ButtonSubmit").unbind('click').bind('click', function () {
            alert('Clicked');
            return false; //to prevent the browser actually following the links!
        });

</script>

Update: If you're having on method then you could use is as below.

Note: When you're using off method it's removing previous click event handler and with on method it adds new one.B'cos of that it does not allow to happen click 2 times.

<script type="text/javascript">

$('#ButtonSubmit').off('click').on('click', function(){

  alert('Clicked');
  return false; //to prevent the browser actually following the links!
}); 

</script>

这篇关于jQuery移动点击事件触发两次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！