JS实现浏览器部分自带的前进后退及刷新等功能

转载 2013年12月06日 15:39:09

一、【文件(F)】菜单中的命令的实现
1、〖打开〗命令的实现
[格式]:document.execCommand("open") 
 [说明]这跟VB等编程设计中的webbrowser
控件中的命令有些相似,大家也可依此琢磨琢磨。
[举例]<body></body>之间加入:
<a href="#" onclick=document.execCommand("open")>打开</a> 
 
2、〖使用记事本编辑〗命令的实现
 [格式]:location.replace("view-source:"+location) 
[说明]打开记事本,在记事本中显示该网页的源代码。
[举例]<body></body>之间加入:
<a href="#" onclick=location.replace("view-source:"+location)>
使用记事本 编辑</a> 

3〖另存为〗命令的实现[格式]:document.execCommand("saveAs") 
[说明]
将该网页保存到本地盘的其它目录!
[举例]
<body></body>之间加入:
<a href="#" onclick=document.execCommand("saveAs")>另存为</a> 

4、〖打印〗命令的实现
[格式]:document.execCommand("print") 
[说明]
当然,你必须装了打印机!
[举例]
<body></body>
之间加入:
<a href="#" onclick=document.execCommand("print")>打印</a> 
 
5、〖关闭〗命令的实现
[格式]:window.close();return false 
[说明]将关闭本窗口。
[举例]
<body></body>之间加入:
<a href="#" onclick=window.close();return false)>关闭本窗口</a> 
 

二、【编辑(E)】菜单中的命令的实现 

  〖全选〗命令的实现 
  [格式]:document.execCommand("selectAll") 
  [说明]将选种网页中的全部内容! 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=document.execCommand("selectAll")>全选</a> 

三、【查看(V)】菜单中的命令的实现 

  1、〖刷新〗命令的实现 

  [格式]:location.reload() 或 history.go(0) 
  [说明]浏览器重新打开本页。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=location.reload()>刷新</a> 
  或加入:<a href="#" onclick=history.go(0)>刷新</a> 

  2、〖源文件〗命令的实现 

  [格式]:location.replace("view-source:"+location) 
  [说明]查看该网页的源代码。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=location.replace("view-source:"+location)>查看源文件</a> 


  3、〖全屏显示〗命令的实现 

  [格式]:window.open(document.location,"url","fullscreen") 
  [说明]全屏显示本页。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=window.open(document.location,"url","fullscreen")>全屏显示</a> 


四、【收藏(A)】菜单中的命令的实现 

  1、〖添加到收藏夹〗命令的实现 

  [格式]:window.external.AddFavorite('url', '“网站名”) 
  [说明]将本页添加到收藏夹。 
  [举例]<body></body>之间加入: 
  <a href="javascript:window.external.AddFavorite('http://oh.jilinfarm.com', '胡明新的个人主页')">添加到收藏夹</a> 

  2、〖整理收藏夹〗命令的实现 

  [格式]:window.external.showBrowserUI("OrganizeFavorites",null) 
  [说明]打开整理收藏夹对话框。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=window.external.showBrowserUI("OrganizeFavorites",null)>整理收藏夹</a> 

五、【工具(T)】菜单中的命令的实现 

  〖internet选项〗命令的实现 

  [格式]:window.external.showBrowserUI("PrivacySettings",null) 
  [说明]打开internet选项对话框。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=window.external.showBrowserUI("PrivacySettings",null)>internet选项</a> 


六、【工具栏】中的命令的实现 

  1、〖前进〗命令的实现 

  [格式]history.go(1) 或 history.forward() 
  [说明]浏览器打开后一个页面。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=history.go(1)>前进</a> 
  或加入:<a href="#" onclick=history.forward()>前进</a> 

  2、〖后退〗命令的实现 

  [格式]:history.go(-1) 或 history.back() 
  [说明]浏览器返回上一个已浏览的页面。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=history.go(-1)>后退</a> 
  或加入:<a href="#" onclick=history.back()>后退</a> 

  3、〖刷新〗命令的实现 

  [格式]:document.reload() 或 history.go(0) 
  [说明]浏览器重新打开本页。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=location.reload()>刷新</a> 
  或加入:<a href="#" onclick=history.go(0)>刷新</a> 

七、其它命令的实现 

  〖定时关闭本窗口〗命令的实现 
  [格式]:settimeout(window.close(),关闭的时间
  [说明]将关闭本窗口。 
  [举例]<body></body>之间加入: 
  <a href="#" onclick=setTimeout(window.close(),3000)>3秒关闭本窗口</a>

使用栈结构简易实现浏览器的后退与前进功能(以Android为例)

使用栈结构简易实现浏览器的前进与后退操作(不使用官方函数),以Android为例...
  • mgsky1
  • mgsky1
  • 2017年05月05日 22:42
  • 636

前端开发面试题 (题目列表页)

前端开发面试题 (题目列表页) AD:https://github.com/markyun/My-blog/tree/master/Front-end-Developer-Questions/Ques...
  • u012798391
  • u012798391
  • 2015年09月12日 15:45
  • 931

js监听浏览器后退事件

最近需求需要,需在浏览器(web 和 h5手机端)实现回退弹框 网上很少找到这个需求,找到的也是有bug的,最后解决了,分享一下问题和解决方案 用到的函数:window.history.pushS...
  • u011650048
  • u011650048
  • 2016年12月02日 12:03
  • 7166

让浏览器记住ajax请求并能前进和后退方法(一)

在我们浏览不同网页的时候,我们可以通过浏览器的前进、后退键来去到我们前后访问过的页面。这都有一个共同点,就是 浏览器地址栏的地址改变了。浏览器自身维护了一个记录用户访问页面历史的栈,栈中记录了用户访...
  • ForeverCjl
  • ForeverCjl
  • 2016年10月31日 14:54
  • 1983

利用js实现 禁用浏览器后退

现在很多的内部系统,一些界面,都是用户手动点击退出按钮的。但是为了避免,用户误操作 点击浏览器后退,或者用鼠标手势后退什么的。容易出现误操作。        所以在有些页面上,适当的禁用浏览器的后退...
  • zc474235918
  • zc474235918
  • 2016年11月12日 10:39
  • 14588

Android WebView的前进、后退、与刷新以及OnkeyDown事件 和 OnBackPressed方法注意点

关于webView再来一发,继续积累。 mWebView.goBack();   //后退   mWebView.goForward();//前进 mWebView.reload(); ...
  • wcl1179851200
  • wcl1179851200
  • 2016年05月06日 14:47
  • 4863

AJAX的刷新和前进后退问题解决

使用AJAX开发分页功能的时候,用户跳转到第5页,但是刷新以后又显示第一页了,能不能刷新后还显示第5页?还有能不能用浏览器的前进后退按钮来浏览AJAX历次的变化。 因为Javascript对do...
  • while_own
  • while_own
  • 2016年02月17日 16:46
  • 2262

通过electron的webView使用按钮控制前进后退

HTML页面如下,使用electron中的webView来进行网页的浏览,然后在总体的html文件中添加两个按钮,前进和后退,布局的话看自己喜欢的位置。 ...
  • chenyidong521
  • chenyidong521
  • 2017年12月18日 15:23
  • 49

JavaScript特效之前进,后退(返回上一级)

前进,后退 function goback(){  history.go(-1);//返回或者history.back(); } function go(){ history.go(1);//前进或...
  • wei_chong_chong
  • wei_chong_chong
  • 2015年07月30日 17:59
  • 1472

h5 history api实现无刷新前进后退

操纵浏览器的历史记录 history.pushState(data, title [, url]):往历史记录堆栈顶部添加一条记录;data会在onpopstate事件触发时作为参数传递过去;titl...
  • liningaa
  • liningaa
  • 2016年09月18日 18:09
  • 2699
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JS实现浏览器部分自带的前进后退及刷新等功能
举报原因:
原因补充:

(最多只允许输入30个字)