关于JS嵌套点击事件的问题。

$().click()  是点击命令
$().click(function(){代码}) 是绑定click事件,并不会直接运行。所以在嵌套的时候就有可能出现重复绑定的问题。下面是使用jsonp跨站访问代码
 1    myChart.on('click', function (params) {
 2             var totalCount = 0;
 3             var objectGidName = new Object();
 4             var listr = "";
 5             var lastinstancecourt = "";
 6             lastinstancecourt = params.value.toString().substring(2);
 7             $.ajax({
 8                 type: "get",
 9                 url: "http://localhost:60360/Test/ReadCaseChinaList",
10                 dataType: "jsonp",
11                 jsonp: "jsonpcallback",//指定回调函数,这里名字可以为任意
12                 data: "category=00301&lastInstanceCourt=" + lastinstancecourt + "&jsonpcallback=?",
13                 success: function (json) {
14                     $('.m-r ul li').remove();
15                     if (json != "") {
16                         var jsons = eval('(' + json + ')');
17                         var obj = jsons.Data;
18                         totalCount = obj.length;
19                         for (var i = 0; i < obj.length; i++) {
20                             objectGidName[obj[i].Gid] = obj[i].Title;
21                             listr = "<li><a href=http://www.pkulaw.cn/case/pfnl_" + obj[i].Gid + ".html?match=Exact>" + obj[i].Title + "</a></li>";
22                             $('.m-r ul').append(listr);
23                         }
24                     }
25                     totalpart.innerText = params.name + "(" + totalCount +")";
26                 }
27             });
28             $('.m-l li').on('click', function () {
29                 var totalCount = 0;
30                 var objectGidName = new Object();
31                 var listr = "";
32                 var categorynow = $(this).find('a').attr('cluster_code');
33                 $.ajax({
34                     type: "get",
35                     url: "http://localhost:60360/Test/ReadCaseChinaList",
36                     dataType: "jsonp",
37                     jsonp: "jsonpcallback",//指定回调函数
38                     data: "category=" + categorynow + "&lastInstanceCourt=" + lastinstancecourt + "&jsonpcallback=?",
39                     success: function (json) {
40                         $('.m-r ul li').remove();
41                         if (json != "") {
42                             var jsons = eval('(' + json + ')');
43                             var obj = jsons.Data;
44                             totalCount = obj.length;
45                             for (var i = 0; i < obj.length; i++) {
46                                 objectGidName[obj[i].Gid] = obj[i].Title;
47                                 listr = "<li><a href=http://www.pkulaw.cn/case/pfnl_" + obj[i].Gid + ".html?match=Exact>" + obj[i].Title + "</a></li>";
48                                 $('.m-r ul').append(listr);
49                             }
50                         }
51                         totalpart.innerText = params.name + "(" + totalCount + ")";
52                     }
53                 });
54             });
55         });
解决办法:
(1)使用unbind("click")先解除事件然后绑定新事件
 1   <script>
 2             $(function(){
 3                 $("#test").click(function(){
 4                     $("#test").unbind('click').click(function(){
 5                         alert("内部click执行");
 6                     });
 7                     alert("外部click执行");
 8                 });
 9             })
10         </script>

(2)使用die()在live()前将绑定的事件都解除掉

 1         <script>
 2             $(function(){
 3                 $("#test").die().live("click",function(){
 4                     $("#test").die().live("click",function(){
 5                         alert("内部click执行");
 6                     });
 7                     alert("外部click执行");
 8                 });
 9             })
10         </script>

--参考地址:http://www.phpddt.com/dhtml/jquery-click-problem.html 



原文地址:https://www.cnblogs.com/pocn/p/6222393.html