不錯的window.open傳值方法(ByFunction)

最近cloudio在遇到很多情況需要在window.open時把值傳過去,接回來

原本cloudio的習慣都是在被open的頁面(簡稱bPage)設定一個hidden

然後再開啟的頁面(簡稱aPage)去設定bPage中hidden的value來動作

最近cloudio在遇到很多情況需要在window.open時把值傳過去,接回來

原本cloudio的習慣都是在被open的頁面(簡稱bPage)設定一個hidden

然後再開啟的頁面(簡稱aPage)去設定bPage中hidden的value來動作

類似這樣:

aPage HTML

 


<input id="Button1" type="button" value="button" onclick="return Button1_onclick()" />

aPage JavaScript

 


var TestCount = 0;
function Button1_onclick() {        
    var Form = window.open("Default2.aspx", "form2", "", "");
    setTimeout(function() {
        PassValueToForm(Form, "cloudio");
    }, 1000);
}

function PassValueToForm(PassForm, Agrs) {
    if (PassForm.document.getElementById("Text1")) {
        PassForm.document.getElementById("Text1").value = Agrs;
    } else {
        if (TestCount <= 10) {//超過10次就不試了
            setTimeout(function() { PassValueToForm(InForm, Agrs); }, 1000);
        } else {
            alert("放棄");
        }
    }
}

bPage的HTML就只放了一個ID等於Text1的text囉

這邊要用setTimeOut的原因是,如果不等直接去判斷有沒有該DOM其實是會有時間差而導致抓不到DOM的問題的

(為了容易看效果,所以cloudio改修改Text的text)

所以要這樣做,還有setTimeOut如果直接

 


setTimeout("PassValueToForm(InForm, Agrs)", 1000);

這樣也是沒有作用的,才會改成建立一個匿名function

原本cloudio想用遞迴呼叫 PassValueToForm但是想一想還是改用setTimeOut並設定最多跑10次比較有效率一點

因為如果開啟後的視窗又被關掉了呢@@那不就永遠跑不停

 

但是這樣做的話實務上是有點有點綁手綁腳的的

那天cloudio的同事發現了另一種用法就是直接改呼叫bPage的function,沒想到還真的能運作

所以cloudio又把code再改寫成這樣:

aPage的HTML沒變

aPage JavaScript


var TestCount = 0;
function Button1_onclick() {
    var Form = window.open("Default2.aspx", "form2", "", "");
    setTimeout(function() { CallFunction(Form, "Cloudio"); }, 500);
}

function CallFunction(InForm, Agrs) {
    TestCount++;
    if (IsFunction(InForm.SetTextValue)) {
        InForm.SetTextValue(Agrs);
    } else {
        if (TestCount <= 10) {
            setTimeout(function() { CallFunction(InForm, Agrs); }, 1000);
        } else {
            alert("放棄");
        }
    }
}

function IsFunction(fn) {
    return !!fn && typeof fn != "string" && !fn.nodeName &&
fn.constructor != Array && /^[\s[]?function/.test(fn + "");
}

bPage JavaScript


function SetTextValue(Agrs) {
    document.getElementById("Text1").value = Agrs;
}

這樣就準備好囉
這邊的IsFunction我是從jQuery偷來的啦:p

這樣要一次調整較多bPage的DOM也比較方便

 

但是如果您接到的值是要給 server端request做處理的話

cloudio會建議您直接參考

window.open的post與get傳遞參數比較

這篇文章:)