JQuery Mobile 在绑定事件时候，发现会被多次执行，为什么啊？
原来，jquery click 不是替换原有的function ，而是接着添加，所以才会执行次数越来越多，怎么办才能按需实现功能？在执行正常点击事件之前，解绑事件！！
JQuery对事件的绑定主要有两种方式，分别是on和bind，这两种方式分别对应的解绑方式为off和unbind，知道这些，我们就可以写代码了：
一，用on和off
???????????// off和on绑定"tap"方法 ???????????$("#changePassword").off("tap").on("tap", function (e) { ???????????????alert(‘clicked on "tap" use "on"‘); ???????????????//加入此方法，阻止元素发生默认的行为 ???????????????e.preventDefault(); ???????????});二，用bind和unbind
???????????// bind和unbind绑定"tap"方法 ???????????$("#changePassword").unbind("tap").bind("tap", function (e) { ???????????????alert(‘clicked on "tap" use "bind"‘); ???????????????//加入此方法，阻止元素发生默认的行为 ???????????????e.preventDefault(); ???????????});说明：JQuery可以把多个操作形成一个链，一起执行，上面语句的unbind和bind，就是被写成链式调用了！
下面是我解决这个问题时候的页面全部源码，如果你想直接运行，修改一下css和JS的引用路径，引入对应版本的文件就可以了！
?1 <!doctype html> ?2 <html> ?3 <head> ?4 ????<meta charset="utf-8"> ?5 ????<meta name="viewport" content="width=device-width, initial-scale=1"> ?6 ??7 ????<!-- 远程JS 可以正常使用 --> ?8 ????<!-- <link rel="stylesheet" href="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css"> ?9 ????<script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script> 10 ????<script src="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> --> 11 ?12 ????<!-- 本地JS--> 13 ????<link rel="stylesheet" href="../js/common/jquery.mobile-1.4.5.min.css"> 14 ????<script src="../js/common/jquery-2.1.4.js"></script> 15 ????<script src="../js/common/jquery.mobile-1.4.5.min.js"></script> 16 ????<!--<script src="../cordova.js"></script>--> 17 ?18 ????<!--<script language="JavaScript">--> 19 ????<!--//添加cordova设备就绪事件--> 20 ????<!--document.addEventListener("deviceready", function () {--> 21 ?22 ????<!--//显示设备信息--> 23 ????<!--//showDeviceInfo();--> 24 ????<!--}, false);--> 25 ?26 ????<!--//显示设备信息--> 27 ????<!--function showDeviceInfo() {--> 28 ????<!--alert(device.cordova);--> 29 ????<!--}--> 30 ?31 ????<!--</script>--> 32 ?33 ????<script language="JavaScript"> 34 ?35 ????????$(document).bind("pageinit", function () { 36 ?37 ????????????//对"tap"事件的绑定 38 ?39 ????????????// off和on绑定"tap"方法 40 ????????????$("#changePassword").off("tap").on("tap", function (e) { 41 ?42 ????????????????alert(‘clicked on "tap" use "on"‘); 43 ?44 ????????????????//加入此方法，阻止元素发生默认的行为 45 ????????????????e.preventDefault(); 46 ????????????}); 47 ?48 ?49 ????????????// // bind和unbind绑定"tap"方法 50 ????????????// $("#changePassword").unbind("tap").bind("tap", function (e) { 51 ????????????// 52 ????????????// ????alert(‘clicked on "tap" use "bind"‘); 53 ????????????// 54 ????????????// ????//加入此方法，阻止元素发生默认的行为 55 ????????????// ????e.preventDefault(); 56 ????????????// }); 57 ?58 ????????????//-------------------------------------------------------------------------- 59 ????????????//对"click"事件的绑定 60 ?61 ????????????// // off和on绑定"click"方法 62 ????????????// $("#changePassword").off("click").on("click", function (e) { 63 ????????????// 64 ????????????// ????alert(‘clicked on "click" use "on"‘); 65 ????????????// 66 ????????????// ????//加入此方法，阻止元素发生默认的行为 67 ????????????// ????e.preventDefault(); 68 ????????????// }); 69 ?70 ????????????// // bind和unbind绑定"click"方法 71 ????????????// $("#changePassword").unbind("click").bind("click", function (e) { 72 ????????????// 73 ????????????// ????alert(‘clicked on "tap" use "bind"‘); 74 ????????????// 75 ????????????// ????//加入此方法，阻止元素发生默认的行为 76 ????????????// ????e.preventDefault(); 77 ????????????// }); 78 ?79 ?80 ????????}) 81 ?82 ????</script> 83 ?84 </head> 85 <body> 86 ?87 <div data-role="Page"> 88 ????<div data-role="header" data-position="fixed"> 89 ????????<a href="index.html" class="ui-btn ui-btn-left ui-corner-all ui-shadow ui-icon-back">返回</a> 90 ????????<h1>设置密码</h1> 91 ????</div> 92 ?93 ????<div data-role="content"> 94 ?95 ????????<form method="post" action="#"> 96 ????????????<input type="text" name="password" id="password"> 97 ????????????<!--<input type="submit" data-inline="true" value="提交">--> 98 ????????????<button id="changePassword" class="ui-btn ui-btn-corner-all ui-corner-all"> 99 ????????????????设置密码100 ????????????</button>101 ????????</form>102 ????</div>103 104 </body>105 </html>参考：
https://blog.csdn.net/gundumw100/article/details/69993029
https://blog.csdn.net/aptentity/article/details/71268011
http://www.w3school.com.cn/jquery/event_preventdefault.asp
JQuery Mobile - 为什么绑定事件后会被多次执行？
原文地址：https://www.cnblogs.com/sunylat/p/9691615.html