DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 完美解決一個事件激活多個函數(2)
完美解決一個事件激活多個函數(2)
編輯:關於JavaScript     


  可是在一個頁面中,我們可能會遇到有多個事件要激活多個函數,每個事件都要寫一遍那樣的代碼,顯然不是好主意。聰明的讀者可能已經想到,應該寫成一個函數activeMore(),哪個事件要激活多個函數的,直接就用activeMore()就行。

  但是在上一部分中我們把事件的toString()當作javascript腳步本運行,實際上是運行一段函數代碼,如果寫成一個函數時還是用這個方法,即為函數中嵌套函數,將會出現意想不到的錯誤。 於是我們寫成函數時把事件的toString()中的“function anonymous()”字符去掉,運行時就不是一個函數,而是函數內部的代碼了。另外我們還可以定義先激活原有的函數還是先激活現在要激活的函數。最後為了方便使用,我們把事件和要激活的函數放在一起作為參數,寫成以下函數:


function activeMore(event_function,order){
// order 為負數時先激活myFunction再激活前面的腳本
var isSn=event_function.indexOf("=",0);
var myEvent=event_function.substring(0,isSn);
var myFunction=event_function.substring(isSn+1,event_function.length);
var prefunction="";
if(eval(myEvent)) prefunction= eval(myEvent).toString().replace('function anonymous()',"");

if(order<0) eval(myEvent+"=new Function(myFunction+'\\n'+prefunction)");
else eval(myEvent+"=new Function(prefunction+'\\n'+myFunction)");
}

  以上函數我們先把參數“event_function”進行字符串分析,得到事件(myEvent)和要激活的函數(myFunction),然後取得原來激活的函數(preFunction),最後把多個函數放在一起激活。因為我們只是把“function anonymous()”去掉,preFunction字符串的兩端會帶有“{ }”號,但並不影響程序的運行。

  下面我們舉一個實際應用的例子:使網頁中所有的鏈接都不出現虛線框。

  為了達到這個目的,我們給所有的鏈接的onfocus事件添加一個激活函數“blur()”。為了保證一些鏈接原有的onfocus事件激活函數仍然有效,我們要用一次activeMore()函數;為了能夠得到所有的鏈接,我們用到document.body的onload事件,又要用一次activeMore()函數:

//使鏈接不出現虛線框:
function blurLinks(){
for(i=0;i activeMore("document.links["+i+"].onfocus=if(this.blur)this.blur()",-1);
}
}
activeMore("document.body.onload=blurLinks()");

  鏈接的onfocus事件(document.links[i].onfocus)要激活的函數是“if(this.blur)this.blur()”,參數order的值為-1表先激活該函數再激活它們原有的函數;document.body.onload事件要激活的函數是“blurLinks()”,參數order的值省略(或為非負數)表先激活它原有的函數再激活“blurLinks()”。

  從例子中可以看到,這個函數用起來還挺簡單吧。有了activeMore()函數,無論多少個事件要激活多個函數,都可以用同樣的語法解決了!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved