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.如果只有一个选项卡,会关闭浏览器。

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

7.网页的前进与后退

  前进

// 方式一
window.history.forward();
// 方式二
window.history.go(1);

  后退

// 方式一
window.history.back();
// 方式二
window.history.go(1); 

说明:前进和后退,界面无刷新。

 

js操作当前窗口的更多相关文章

  1. java selenium webdriver处理JS操作窗口滚动条

    未经作者允许,禁止转载!!! java selenium webdriver处理JS操作窗口滚动条 java selenium webdriver处理JS操作窗口滚动条 import org.open ...

  2. selenium中元素操作之浏览器窗口滚动&网页日期控件操作(js操作)(五)

    js的滚动条scrollIntoView() Arguments[] - python与js之间的羁绊 1.移动到元素element对象的“底端”,与当前窗口的“底部”对齐: driver.execu ...

  3. JS子父窗口互相操作取值赋值的方法介绍

    $("#父窗口元素ID",window.parent.document); 对应javascript版本为window.parent.document.getElementById ...

  4. 转-JS子窗口创建父窗口操作父窗口

    Javascript弹出子窗口  可以通过多种方式实现,下面介绍几种方法 (1) 通过window对象的open()方法,open()方法将会产生一个新的window窗口对象 其用法为: window ...

  5. JS打开新窗口,子窗口操作父窗口

    <!--父窗口弹窗代码开始--> <script type="text/javascript"> function OpenWindow() { windo ...

  6. JS获取子窗口中返回的数据

    在开发的时候,遇到了这样一个问题,客户填写自己的收货地址,可以新建,但同时也可以选择之前填写的,由于我们的客户本身就是商户,地址繁多,把它之前的地址简单用个下拉框罗列出来显然不合适,并且客户要求能够对 ...

  7. Js打开新窗口拦截问题整理

    一.js打开新窗口,经常被拦截 //js打开新窗口,经常被拦截 //指定本窗口打开,可以使用 window.open('http://www.tianma3798.cn', '_self'); //不 ...

  8. js操作bom和dom

    Bom 概念 BOM : Browser Object Model 浏览器对象模型,描述与浏览器进行交互的方法和接 口, ECMAscript是javascript的核心,但如果要在web中使用jav ...

  9. 原生JS操作iframe里的dom

    转:http://www.css88.com/archives/2343 一.父级窗口操作iframe里的dom JS操作iframe里的dom可是使用contentWindow属性,contentW ...

随机推荐

  1. 「NOI2018」归程

    「NOI2018」归程 题目描述 本题的故事发生在魔力之都,在这里我们将为你介绍一些必要的设定. 魔力之都可以抽象成一个 >\(1\) 个节点. \(m\) 条边的无向连通图(节点的编号从 \( ...

  2. [CODECHEF]LUCASTH

    题意:设$f(n,k)=\sum\limits_{\substack{S\subseteq\{1,\cdots,n\}\\|S|=k}}\prod\limits_{x\in S}x$,问$f(n,0\ ...

  3. python安装BeautifulSoup

    1.先下载pip https://pypi.python.org/pypi/pip 安装pip cd到路径 python setuo.py install 2.添加目录到环境变量中 xxx\Pytho ...

  4. centos6.5编译安装nginx

    系统64位 centos6.5 nginx官网:http://nginx.org/ 下载nginx源码包: wget  http://nginx.org/download/nginx-1.6.2.ta ...

  5. XCode6 ,iOS之PCH文件配置

    1: 创建PCH文件 NewFile-->Other中的PCH File-->Next-->Create 2:配置PCH文件 项目中的TARGETS-->Build Setti ...

  6. iOS笔记 基于MKNetworkKit的断点续传

    http://iiiyu.com/2012/07/07/learning-ios-notes-eight/

  7. Ui Automator Test Through Command

    问题描述: 通过adb shell uiautomator runtest 命令,直接运行java测试例. 命令解析: adb shell uiautomator runtest <JARS&g ...

  8. WPF中的动画——(六)演示图板

    前面所介绍的都是单一的动画,它只能修改单一属性.有的时候,我们需要将一组动画一起进行,对于一个按钮,我们可能有如下需求: 选择该按钮时,该按钮增大并更改颜色. 单击该按钮时,该按钮缩小并恢复其原始大小 ...

  9. JavaScript入门详解

    开始开发工作. 一.Alert Confirm Prompt <html> <head> <script type="text/javascript" ...

  10. localstorge的缓存写法(超过一定时间自动清空)

    使用缓存: (设置缓存,尽量用大写,下划线的写法) const ls = { set: function (variable, value, ttl_ms) { var data = {value: ...