js 匿名函數 閉包

沒有彈出框

1

2

3

4

5

6

7

<code>&lt;script language=</code><code>"javascript"</code> <code>type=</code><code>"text/javascript"</code><code>&gt;</code>

<code>function</code> <code>start(){</code>

<code>var</code> <code>nid=document.getElementsByTagName(</code><code>"li"</code><code>);</code>

<code>nid.onclick=</code><code>function</code><code>(){alert(</code><code>"4"</code><code>);}</code>

<code>}</code>

<code>window.onload=start;</code>

<code>&lt;/script&gt;</code>

這樣才有彈出對話框

<code>nid.onclick=(</code><code>function</code><code>(){alert(</code><code>"4"</code><code>);})()</code>

運作後，不論點選哪一個li，都是alert提示“4”。

這就是一個需要注意的地方：

閉包允許内層函數引用父函數中的變量，但是該變量是最終值。閉包引用的變量i，是循環結束後的值

<code>var</code> <code>li=document.getElementsByTagName(</code><code>"li"</code><code>);</code>

<code>for</code><code>(</code><code>var</code> <code>i=0;i&lt;li.length;i++){</code>

<code>li[i].onclick=</code><code>function</code><code>(){alert(i);}</code>

用閉包來解決

&lt;script language="javascript" type="text/javascript"&gt;

var li=document.getElementsByTagName("li");

for(var i=0;i&lt;li.length;i++){

   (function(index){

   li[index].onclick=function(){alert(index);}

   })(i); 

}

&lt;/script&gt;

注意順序：先彈出“clicked” 再彈出“also clicked”

<code>&lt;script&gt;</code>

<code>var</code> <code>fnClick1 =</code><code>function</code><code>(){ alert(</code><code>"clicked"</code><code>); };</code>

<code>var</code> <code>fnClick2 =</code><code>function</code><code>(){ alert(</code><code>"also clicked"</code><code>); };</code>

<code>var</code> <code>oDiv = document.getElementById(</code><code>"div"</code><code>);</code>

<code>oDiv.attachEvent(</code><code>"onclick"</code><code>,fnClick2);</code>

<code>oDiv.attachEvent(</code><code>"onclick"</code><code>,fnClick1);</code>

 先彈出“also clicked” 再彈出“clicked”

.onclick後面的是最先執行的 

attachEvent進去的事件 就DOM的解釋是亂續的。 

但實際測試時 IE是後綁定的先執行,FF是先綁定的先執行.

    本文轉自曾祥展部落格園部落格，原文連結：http://www.cnblogs.com/zengxiangzhan/archive/2009/12/02/1615644.html，如需轉載請自行聯系原作者