快捷導(dǎo)航

在服務(wù)端(Page.Write)調(diào)用自定義的JS方法詳解

更新時(shí)間：2013年08月09日 11:18:13 作者：

自從[javascript]自定義MessageBox一文發(fā)布以后，很多網(wǎng)友都來(lái)信詢(xún)問(wèn)，如何在服務(wù)端調(diào)用ShowInfo方法，周末休息想了個(gè)折中的辦法來(lái)實(shí)現(xiàn)

首先，我們應(yīng)該可以先明確，為什么我們用Page.Write把自定義的JS方法輸出到頁(yè)面上為什么IE不能識(shí)別，會(huì)出現(xiàn)“XXX未定義”的錯(cuò)誤。原因很簡(jiǎn)單，因?yàn)槲覀冇肞age.Write輸出的腳本是出現(xiàn)在頁(yè)面的最頂端。IE讀到是javascript函數(shù)的時(shí)候，就開(kāi)始執(zhí)行，但是此時(shí)我們link的js文件并未被IE讀入，所以IE無(wú)法識(shí)別我們定義在js文件里面的方法。那write alert為什么可以呢？因?yàn)閍lert是IE內(nèi)嵌的腳本功能函數(shù)，不管有沒(méi)有頁(yè)面，IE都認(rèn)得它。
找到問(wèn)題所在，自然就好解決了：
1、把我們自定義的方法內(nèi)嵌到IE里面。－－－> 看起來(lái)有點(diǎn)異想天開(kāi)，呵呵
2、等頁(yè)面載入完成后再觸發(fā)事件。－－－>觸發(fā)事件，沒(méi)錯(cuò)。
如何知道頁(yè)面是否載入完成呢？
1、通過(guò)document的狀態(tài)
2、通過(guò)事件觸發(fā)（windows.onload）
第一種好像比較不保險(xiǎn)，有時(shí)候明明已經(jīng)全部載完了，它還是一直顯示在傳送數(shù)據(jù)（FF此情況最明顯），所以還是用事件比較保險(xiǎn)一點(diǎn)。
定義一個(gè)簡(jiǎn)單方法，掛載到windows.onload里面，執(zhí)行的時(shí)候做一個(gè)標(biāo)識(shí)

復(fù)制代碼代碼如下:

var loadComplete = false;
function LoadCompleted()
{
loadComplete= true;
}
window.attachEvent("onload",LoadCompleted);

呵呵，這樣我們只要通過(guò)判斷l(xiāng)oadComplete來(lái)取得頁(yè)面是否載入完畢了。

復(fù)制代碼代碼如下:

var mImgdir = "";
var mCaption = "caption";
var mMsg = "Message";
var mOkClick= null;
function ShowMessage(imgdir,caption,msg,OkClick)
{
if(loadComplete)
{
KMessageBox.ShowInfo(mImgdir,mCaption,mMsg,mOkClick);
}
}

這樣子在loadComplete未false的情況下，我們就不會(huì)去執(zhí)行KMessageBox.ShowInfo（）方法，只然就不會(huì)出現(xiàn)JS錯(cuò)誤提示了。
單單這樣子，還不行，因?yàn)檩敵龅倪@樣的腳本，IE只在輸出頁(yè)面的時(shí)候執(zhí)行了一次，但是此時(shí)loadComplete＝false，所以，我們需要定時(shí)檢測(cè)頁(yè)面是否載入完畢。說(shuō)到定時(shí)，只然是祭出setTimeout & setInterval. 我們這里需要不停的檢測(cè)，故使用setInterval方法。最終代碼如下：

復(fù)制代碼代碼如下:

var loadComplete = false;
var mImgdir = "";
var mCaption = "caption";
var mMsg = "Message";
var mOkClick= null;
var timerID;
function ShowMessage(imgdir,caption,msg,OkClick)
{
if(loadComplete)
{
KMessageBox.ShowInfo(mImgdir,mCaption,mMsg,mOkClick);
     //卸載此事件     window.detachEvent("onload",function(){LoadCompleted;});     //停止定時(shí)觸發(fā)
     window.clearInterval(timerID); 
    } 
}
function LoadCompleted() { loadComplete=true; }
window.attachEvent("onload",LoadCompleted);
//設(shè)置定時(shí)檢測(cè)機(jī)制
timerID = window.setInterval(ShowMessage,1);

當(dāng)然以上代碼只兼容IE，因?yàn)槭褂胊ttachEvent 和 detachEvent，至于讓他兼容其他瀏覽器可以參看[JavaScript]自定義Title的顯示方式一文中的處理方式：

復(fù)制代碼代碼如下:

if(!document.attachEvent)//Not IE
{
document.attachEvent = function(){document.addEventListener(arguments[0].substr(2),arguments[1],arguments[2])}
}
if(!window.attachEvent)//Not IE
{
window.attachEvent = function(){window.addEventListener(arguments[0].substr(2),arguments[1],arguments[2])}
}
 

在服務(wù)端，只要StringBuilder出以上的腳本，然后Write出來(lái)就可以了。上面也只是提供了一種思路，當(dāng)然還會(huì)有其他的辦法，比如我不適用定時(shí)檢測(cè)，我直接掛載到windows.onload里面，讓頁(yè)面自動(dòng)監(jiān)聽(tīng)，自動(dòng)執(zhí)行，也未嘗不可：），正所謂條條大路通羅馬嘛～～～～～
以上思路來(lái)自yui，并且yui實(shí)現(xiàn)了一個(gè)更漂亮的自定義MessageBox，有興趣的朋友可以共同研究下。

您可能感興趣的文章: