欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js循環(huán)動態(tài)綁定帶參數(shù)函數(shù)遇到的問題及解決方案[轉]

 更新時間:2010年11月11日 15:00:01   作者:  
關于Javascript利用循環(huán)綁定事件的例子,需要的朋友可以參考下。
眾所周知,不帶參數(shù)的綁定非常簡單,只要使用(語法:“document.getElementById("對象ID名").attachEvent("事件名,如onchange",函數(shù)名);”)(示例:“document.getElementById("select_0").attachEvent("onchange",modifyFunction);”)即可。(注:以下只寫示例)
帶參數(shù)的綁定就要復雜一些:document.getElementById("select _0").attachEvent("onchange",function(){modifyFunction (obj,i););即在function()中寫需要執(zhí)行的函數(shù)即可。當然還有另一種寫法:document.getElementById("select _0"). onchange=function(){modifyFunction (obj,i););。
綁定成功,OK。不過,慢,此時又遇到了第二個問題,傳遞過去的參數(shù)值都是同一個,并不是想象中的將i的值傳遞過去后,每個綁定的函數(shù)的參數(shù)值都不一樣。
于是乎,上網(wǎng)百度。經(jīng)過艱難的搜索測試,期間還找到一個如下所示的例子:
復制代碼 代碼如下:

<script>
document.onclick=check;
function check() {
if(event.srcElement.type== "button ")
alert(event.srcElement.name);
}
</script>
<input type=button name=button1>
<input type=button name=button2>

此例子是通過event找到有動作的組件,然后獲取它的源,再取出name值。這樣就可以通過傳入的obj,獲得是第幾個obj,然后進行相應的操作。
只是還有個問題,經(jīng)過這種操作之后,obj的值又出現(xiàn)了問題,不管操作哪個select,獲得的值都是最后一個。
繼續(xù)百度。
終于,在一篇文章中獲得了原因。文章轉帖如下:
我們先看一個關于Javascript利用循環(huán)綁定事件的例子:
例如:一個不確定長度的列表,在鼠標經(jīng)過某一條的時候改變背景。

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]

這個例子循環(huán)為一組對象綁定事件處理函數(shù)。
但是,如果我們在這個基礎上增加一些需求。比如在點擊某一條記錄的時候彈出這是第幾條記錄?
肯能你會理所當然的這么寫:

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]

測試一下你會發(fā)現(xiàn)alert出來的都是:這是第6記錄
其實這里for循環(huán)已將整個列表循環(huán)了一遍,并執(zhí)行了i++,所以這里i變成了6,
有什么好的辦法解決這個問題嗎?
那就是閉包了,個人認為閉包是js中最難捉摸的地方之一,
看看什么是閉包:
閉包時是指內層的函數(shù)可以引用存在與包圍他的函數(shù)內的變量,即使外層的函數(shù)的執(zhí)行已經(jīng)終止。
這個例子中我們可以這樣做:

[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]

PS:閉包很難,很復雜!
經(jīng)過以上文章可以得知,引起這個問題的原因其實是因為js的閉包難題。按照面向對象的JAVA語言的理解可以解釋為:js循環(huán)動態(tài)綁定帶參數(shù)函數(shù)中的參數(shù),其實相當于java中的引用傳遞,而非值傳遞。傳遞進來的引用只相當于一個指針,指向的是一個內存地址,這個內存地址存放的才是具體的值,而外面的循環(huán)會不斷的修改這個存放地址中的值,所以最后循環(huán)結束之后,參數(shù)的值只能找到最后一個。
知道了原因就很好解決了。New一個新的“函數(shù)類”(姑且這么稱呼吧)。測試OK。一下是修改后的代碼:
復制代碼 代碼如下:

//在新增按鈕上綁定函數(shù)
document.getElementById("add").attachEvent("onclick",addFunction);
var jc_count = 0;//定義需要改變第幾行的值
function txzmcFunction(x,y){//下拉框中綁定的函數(shù)
var sql="select txzjc from dm_txzmc where dm='"+x.value+"'";//取得下拉框中的代碼,通過ajax獲得相應的中文名稱
jc_count = y;//定義當前行是第幾行
ajaxSelect(sql,"txzjcFunction");//封裝的ajax函數(shù)
}
function txzjcFunction(x){//接收封裝的ajax函數(shù)返回值,并賦值
document.getElementById("_subarea_hxax_clzjxxb_hxax_txzxxb_update_txzjc_"+jc_count).value=x;
}
function bb(dx,sz){//解決動態(tài)綁定閉包問題要用到函數(shù)
this.clickFunc=function(){
txzmcFunction(dx,sz);//調用相應的函數(shù)
}
}
function addFunction(){ //動態(tài)循環(huán)綁定
var count=document.getElementById("_subarea_hxax_clzjxxb_hxax_txzxxb_update_maxcount").value;//獲取最大的行數(shù)
for (var i=0;i<count ;i++ )//循環(huán)綁定
{
var obj=document.getElementById("_subarea_hxax_clzjxxb_hxax_txzxxb_update_txzmc_" +i);
var tp = new bb(obj,i);//解決閉包問題,new一個新的函數(shù)類
obj.onchange = tp.clickFunc;
}
}
//顯示頁面時執(zhí)行一次
addFunction();

相關文章

最新評論