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结合,便完成了一种很好用的效果。
新闻热点
疑难解答
图片精选