js操作当前窗口

时间：2021-04-22 03:24:09
 

CreateTime--2017年7月21日09:58:34
Author:Marydon

js操作当前窗口

1.打开一个新的窗口（新的标签页）

实现方式：window.open(url)

实例一：

　　HTML片段

<input id="test" type="button" value="打开一个新的标签页窗口" onclick="openNewTag();"/>

　　JAVASCRIPT部分

/**

 * 在当前浏览器上打开一个新的标签页

 */

function openNewTag () {

    var url = "www.baidu.com";

    url = "http://" +　url;

    window.open(url);

}

实例二：

<!-- 方式一：推荐使用 -->

<a href="javascript:;" onclick="window.open('<c:url value="/uploadfile/134557/000225326/进击的巨人-三笠.jpg"/>')">

    操作js打开新的标签页

</a>

<!-- 方式二 -->

<a href="javascript:;" onclick="window.open('http://127.0.0.1:8060/ycyl/uploadfile/134557/000225326/进击的巨人-三笠.jpg')">

    操作js打开新的标签页

</a> 

2.在本标签页实现本页面跳转

实现方式：window.location.href=url

实例一：

　　HTML片段

<input id="test" type="button" value="页面跳转" onclick="pageHref();"/>

　　JAVASCRIPT部分

/**

 * 在当前标签页跳转到其他页面

 */

function pageHref () {

    var url = "www.baidu.com";

    url = "http://" +　url;

    window.location.href = url;

}

实例二：

/**

 * 返回List展示页面

 */

this.goback = function(){

    window.location.href = baseUrl+"/telemedicine/patient/index.do?RESULT_TYPE=modelAndView9";

}
<table cellspacing="0" cellpadding="0" border="0" width="100%" height="100%">

    <tbody>

        <tr>

            <td align="right">

                <!-- 进行评价 -->

                <input type="button" onclick="consEval.save();" class="Button" style="margin-right:40px;" value="提交"

                    onmouseover="javascript:this.className='ButtonOver'" onmouseout="javascript:this.className='Button'"/>

            </td>

            <td align="left">

                <!-- 返回 -->

                <input type="button" onclick="consEval.goback();" class="Button" style="margin-left:40px;" value="返回"

                    onmouseover="javascript:this.className='ButtonOver'" onmouseout="javascript:this.className='Button'"/>

            </td>

        </tr>

    </tbody>

</table>

3.在本标签页实现父页面跳转

实现方式：parent.location.href=url

4.刷新页面

　　4.1 刷新本页面

// 方式一

window.location.reload();

// 方式二

window.history.go(0);

// 方式三

window.location.href = window.location.href;

// 方式四

window.location.replace(window.location.href);　　

　　4.2 刷新父页面

　　实现方式：parent.document.location.reload();

　　相当于按F5键

5.打印网页

实现方式：window.print();

6.关闭当前选项卡

实现方式：window.close();

说明：

　　1.这种方式会有提示；

　　2.如果只有一个选项卡，会关闭浏览器。

js操作当前窗口

UpdateTime--2018年3月23日16:53:01

7.网页的前进与后退

　　前进

// 方式一

window.history.forward();

// 方式二

window.history.go(1);

　　后退

// 方式一

window.history.back();

// 方式二

window.history.go(1);　

说明：前进和后退，界面无刷新。

 

相关文章