self.opener用法

解析

self.opener的意思是本窗口的父窗口,也就是说通过哪个窗口打开了本窗口,哪个窗口就是本窗口的self.opener。

实例

动网论坛更改头像中运用了这个方法。在其mymodify.asp页面中有个头像图片:<img id="face" src="Images/userface/image1.gif" width="32" height="32" />,此页还有一个“头像预览”的文本链接供打开一个新的页面smiley.asp来选择头像图片,在smiley.asp中主要代码如下:
<tr>

<td align="center" height="50">
<img src="Images/userface/image31.gif" alt="" style="CURSOR: hand" onclick="insertface('Images/userface/image31.gif',this.width,this.height)" />
<br />image31.gif</td>

<td align="center" height="50">
<img src="Images/userface/image32.gif" alt="" style="CURSOR: hand" onclick="insertface('Images/userface/image32.gif',this.width,this.height)" />
<br />image32.gif</td>

<td align="center" height="50">
<img src="Images/userface/image33.gif" alt="" style="CURSOR: hand" onclick="insertface('Images/userface/image33.gif',this.width,this.height)" />
<br />image33.gif</td>

<td align="center" height="50">
<img src="Images/userface/image34.gif" alt="" style="CURSOR: hand" onclick="insertface('Images/userface/image34.gif',this.width,this.height)" />
<br />image34.gif</td>

<td align="center" height="50">
<img src="Images/userface/image35.gif" alt="" style="CURSOR: hand" onclick="insertface('Images/userface/image35.gif',this.width,this.height)" />
<br />image35.gif</td>

<td align="center" height="50">
<img src="Images/userface/image36.gif" alt="" style="CURSOR: hand" onclick="insertface('Images/userface/image36.gif',this.width,this.height)" />
<br />image36.gif</td>

</tr>
<script language="javascript">
function insertface(userface,width,height){
    self.opener.theForm.myface.value=userface;
    self.opener.theForm.width.value=width;
    self.opener.theForm.height.value=height;
    self.opener.document.images['face'].src=userface;
    self.opener.document.images['face'].width=width;
    self.opener.document.images['face'].height=height;

}
</script>

这样就实现了改变头像图片连接但不刷新页面!!!

附:用window.opener 改变图片连接但不刷新页面

      今天要实现一个添加用户信息的功能,有一项内容是给用户添加个人相片,但要求是点击 添加 按钮后让用户选择待上传的图片,上传完毕后自动显示刚刚上传的图片,但不能刷新整个页面,以免刚才填的信息丢失。
      想到的解决方法如下:
      1.点击添加按钮后 调用javascript:window.open()方法 弹开一个新的页面 包含FORM表单 和<input type="file">控件,用来上传用户选择的图片文件。
      2.图片上传成功后,返回到一个JSP文件,传递回来刚才上传的图片服务器路径。
用 window.opener 方法调用要显示图片的JSP文件(即:触发弹开页面的JSP文件)的<img src="">控件,改变其中src的值,实现图片的即时显示。
      <script language="javascript">
          var src='<%=basePath+photoURL%>';//得到传回来的图片地址
          window.opener.document.getElementById("photo").src = src; //photo是<img>控件的name值,将得到的图片地址赋给<img src="" name="photo">
          window.close();
    </script>

附:用opener不刷新页面父窗口

      self.opener.location.reload();

上一篇: 隐藏部分文件扩展名的技巧
下一篇: QQ历史签名
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
最新日志:
评论: 1 | 引用: 0 | 查看次数: 6796
发表评论
登录后再发表评论!