這篇文章是參考：http://www.dotblogs.com.tw/puma/archive/2008/09/03/5288.aspx修改後而成。

.js file:

function openWindowWithPost(url, name, keys, values) { //開新視窗，這邊我不指定新視窗的網址
    var newWindow = window.open("", name, "height=700, width=600, toolbar=no, menubar=no, scrollbars=yes, resizable=yes, location=no, status=no");
    if (!newWindow) return false;
    var html = "";
    html += "<html><head></head><body><form id='formid' method='post' action='" + url + "'>";
    if (keys && values && (keys.length == values.length))
        for (var i = 0; i < keys.length; i++)
        html += "<input type='hidden' name='" + keys[i] + "' value='" + values[i] + "'/>";
    html += "</form><script type='text/javascript'>document.getElementById(\"formid\").submit()</script></body></html>";
    newWindow.document.write(html);
    return newWindow;
}
function Post(url) { //這個function會把網頁中所有的form找出來，並且找出每個form所包含的elements
    var keys = [];
    var values = [];
    for (var i = 0; i < document.forms.length; i++) {
        for (var j = 0; j < document.forms[i].elements.length; j++) {
            if (document.forms[i].elements[j].name != undefined &&
                document.forms[i].elements[j].value != undefined) {
                keys[keys.length] = document.forms[i].elements[j].name;
                values[values.length] = document.forms[i].elements[j].value;
            }
        }
    }
    openWindowWithPost(url, "網頁標題", keys, values);
}

 

.aspx file:

<form...>
    <input...>
    <input...>
    <input...>
</form>
<input type="button" value="Post" onclick="Post('處理POST資料的ASPX網頁');" />

 

處理POST資料的ASPX網頁:(VB.NET)

If Request.Form("ItemName") <> Nothing Then
    Response.Write(Request.Form("ItemName").ToString())
End If

 

 

應用：
開新視窗後，如果要顯示的頁面資料很多，怎麼先顯示一個Loading圖片讓使用者知道網頁還在跑，沒有死掉呢？
如下。

js 部分：

<script type="text/javascript">
    function init() {
        //alert("主要網頁已完全載入");
        var _oTag = document.getElementById("divLoading");
        _oTag.style.display = "block"; //顯示動畫
        //在這邊處理接下來要做的事情。
        document.getElementById("formid").submit();
    }
    
    if (window.attachEvent) {
        window.attachEvent('onload', init);
    }
    else {
        window.addEventListener('load', init, false);
    }
    function iframeOnLoad() {
        var _oTag = document.getElementById("divLoading");
        _oTag.style.display = "none"; //當iframe網頁已完全載入後，隱藏動畫
    }
</script>

 

html 部分：

<form id='formid' target='mains' method='post' action='目標頁.aspx'>
    <input...>
    <input...>
    <input...>
</form>

<div align="center" id="divLoading">
<img border="0" src="images/loading14.gif" alt="" /><br/>網頁載入中，請稍候...
</div>

<iframe id="mains" name="mains" title="iframe頁框" allowtransparency="true" 
border="0" frameBorder="0" width="550" height="550"
scrolling="no" onload="javascript:iframeOnLoad();"></iframe>

 

PS. html部份可以用ASP寫form的input field進去。


arrow
arrow
    文章標籤
    asp.net javascript
    全站熱搜

    伊 發表在 痞客邦 留言(0) 人氣()