最近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會建議您直接參考
這篇文章:)