標籤:margin har logs ack cdn code UI var tle
js中立即執行函數的應用:應用到事件綁定上。
少說多做,直接運行代碼(代碼中有注釋):
1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8" /> 5 <meta http-equiv="X-UA-Compatible" content="ie=edge" /> 6 <title>js立即執行函數應用--事件綁定</title> 7 <style type="text/css"> 8 div{ 9 margin: 10px;10 border: 1px solid #009F95;11 cursor: pointer;12 }13 </style>14 15 </head>16 <body>17 <div id="a1">18 a119 </div>20 <div id="a2">21 a222 </div>23 <div id="a3">24 a325 </div>26 <script src="https://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script>27 <script type="text/javascript">28 $(29 function(){30 var eve = [‘#a1‘,‘#a2‘,‘#a3‘];31 for(var i=0;i<eve.length;i++){32 //關鍵點:立即執行函數33 (function(i){34 $(eve[i]).on(‘click‘,function(){35 alert(‘觸發第‘+(i+1)+‘事件‘);36 });37 })(i);//關鍵點:傳入當前迴圈值i38 }39 }40 );41 </script>42 </body>43 </html>
運行結果:
當點擊id為a1,a2,a3的div時分別觸發對應的事件。
js立即執行函數應用--事件綁定