DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 一種常用效果的實現(Javascript的子父頁訪問、函數調用)
一種常用效果的實現(Javascript的子父頁訪問、函數調用)
編輯:關於JavaScript     

效果:比如一個設備管理系統的某處要填入設備編號,但設備編號通常比較難記,而可能記住的只是哪個部門哪個位置的設備。因此,我們想在文本框旁邊加一個按鈕,點擊之後彈出一個子頁面,這裡有設備編號、設備的各項詳情對照的一個表格,我只要根據位置找到該設備,雙擊此記錄,設備編號便填上去了。

實現過程:
父頁面
打開新窗口的javascript函數為:
    function openpage(htmlurl)
    {
        var newwin=window.open(htmlurl,"newWin","toolbar=no,location=no,directories=no,status=no,scrollbars=yes,menubar=no,
resizable=yes,top=100,left=200,width=650,height=300");
        newwin.focus();
        return false;
    }
    </script>在按鈕中調用:
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="return openpage('child.aspx');"/>
子頁面
綁定gridview的數據源,並在它的RowDataBound事件裡寫代碼如下:
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        string s = "window.opener.document.getElementById('textbox1').value='" + e.Row.Cells[1].Text + "'; window.close();";
        if (e.Row.RowType != DataControlRowType.Header)
        {
            e.Row.Attributes.Add("ondblclick", s);//雙擊選擇
            //當鼠標移到的時候設置該行顏色為"", 並保存原來的背景顏色
            e.Row.Attributes.Add("onmouseover", "currentcolor=this.style.backgroundColor;this.style.backgroundColor='#C0C0FF';this.style.cursor='hand';");
            //當鼠標移走時還原該行的背景色
            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor");
        }
    }說明:通過window.open打開新頁面,兩個頁面之前便有了一種父子關系。子頁通過opener可以訪問父頁(控件及寫在父頁的js函數),父頁同樣通過sub可以訪問子頁。如在父頁有個js函數sayhello(),在子頁中只需要opener.sayhello()便可以調用了。

只使用很少的Javascript代碼與asp.net結合,便完成了一種很好用的效果。

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