Dreamweaver教程 FrontPage教程 Flash教程 CSS教程
  • javascript教程
  • 当前位置:教程 > 网页制作 > javascript教程 > 正文

    一种常用效果的实现(Javascript的子父页访问、函数调用)

    编辑:教程网 来源:网络 时间:2011年09月16日 16:47

    效果:比如一个设备管理系统的某处要填入设备编号,但设备编号通常比较难记,而可能记住的只是哪个部门哪个位置的设备。因此,我们想在文本框旁边加一个按钮,点击之后弹出一个子页面,这里有设备编号、设备的各项详情对照的一个表格,我只要根据位置找到该设备,双击此记录,设备编号便填上去了。

    实现过程:
    父页面
    打开新窗口的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结合,便完成了一种很好用的效果。


  • 原文来自 教程网 转载请注明:http://www.websmill.com/wangye/javascript/23555.html

  • 上一篇:JavaScript多风格浮动在线QQ客服(13套皮肤)支持FF,Opera,IE5.5
  • 下一篇:以新窗口的形式打开目标链接