js跳转页面、页面传值、页面刷新（笔记）

最新推荐文章于 2024-04-24 12:48:55 发布

月疯

最新推荐文章于 2024-04-24 12:48:55 发布

阅读量3.4k

点赞数

分类专栏：【javascript】

【javascript】专栏收录该内容

35 篇文章 4 订阅

订阅专栏

1.在原来的窗体中直接跳转用

1.超链接<a href="http://www.jb51.net" title="htt">Welcome</a>

等效于js代码

window.location.href="http://www.jb51.net";     //在同当前窗口中打开窗口

2、在新窗体中打开页面用：

window.open('你所要跳转的页面');

window.history.back(-1);返回上一页


实例代码：
<input type="submit" name="Submit" value="同意" onclick=window.open(http://www.111cn.net/)>


例如：

<a href="javascript:history.go(-1);">向上一页</a>

3、

2.window.navigate方式跳转
   <script language="javascript">
    window.navigate("target.aspx");
</script>

4、window.loction.replace方式实现页面跳转，注意跟第一种方式的区别

<script language="javascript">
    window.location.replace("target.aspx");
</script>

5、self.location方式实现页面跳转，和下面的top.location有小小区别

<script language="JavaScript">
          self.location='target.aspx';
   </script>

6、top.location

<script language="javascript">
          top.location='target.aspx';
   </script>

7、meta方式实现跳转(content = 3 单位是秒)

<meta http-equiv=refresh content=3;URL="http://www.dayanmei.com">

js页面跳转并传值的常用方法

1、在url路径后面带参数，参数与url之间用?隔开，参数与参数之间用&符隔开

 	window.location.href = "a.html?name='kevin'&age='20'";


例如：传值
<html>    
    <head>    
        <title> New Document </title>    
        <script>    
          function  to (){    
            var  getval =document.getElementById("cc").value;    
            document.location.href("b.html?cc="+getval);       
          }    
        </script>    
    </head>    
    <body>    
        <input type="text" id ="cc" > <input type="button"  value="a"  onclick="to()" >    
    </body>   
</html> 

取值：
<html>    
 <head>    
 <title> New Document </title>    
 <script>      
  var thisURL = document.URL;      
  var  getval =thisURL.split('?')[1];    
  var showval= getval.split("=")[1];    
  function  showvalf(){    
     alert(showval);    
     document.getElementById('ee').value=showval;    
  }    
</script>    
 </head>    
 <body onload="showvalf()">    
  <input type="text"  id ="ee" />    
 </body>    
</html>  


2、通过localStorage 和 sessionStorage 先存本地在取出数据

   用setItem来存数据，第一个参数是 名字，第二个参数是存数的数据


	//存数据
   	 window.localStorage.setItem("data", "kevin");
   	 window.sessionStorage.setItem("data", "kevin");

3、用getItem来取数据，参入要取数据的 名字就好

	//取数据
   	window.localStorage.getItem("data");
    window.sessionStorage.getItem("data");



注意：
当然如果要存储的数据是一个对象的话，就需要将对象转换为字符串，在取数据的在将字符串转为对象就可以了
对象转字符串 JSON.stringify( " 对象 " )

字符串转对象 JSON.parse( " 字符串 " )

页面刷新的几种方法：

Javascript刷新页面的几种方法： 
1    history.go(0) 
2    location.reload() 
3    location=location 
4    location.assign(location) 
5    document.execCommand('Refresh') 
6    window.navigate(location) 
7    location.replace(location) 
8    document.URL=location.href

自动刷新页面的方法: 
1.页面自动刷新：把如下代码加入<head>区域中 
<meta http-equiv="refresh" content="20"> 
其中20指每隔20秒刷新一次页面. 

2.页面自动跳转：把如下代码加入<head>区域中 
<meta http-equiv="refresh" content="20;url=http://www.wyxg.com"> 
其中20指隔20秒后跳转到http://www.wyxg.com页面

js刷新框架页面：


//如何刷新包含该框架的页面用 
<script language=JavaScript> 
   parent.location.reload(); 
</script> 

//子窗口刷新父窗口 
<script language=JavaScript> 
    self.opener.location.reload(); 
</script> 
(　或　<a href="javascript:opener.location.reload()">刷新</a>   ) 

//如何刷新另一个框架的页面用 
<script language=JavaScript> 
   parent.另一FrameID.location.reload(); 
</script>

月疯

关注

0
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
js跳转页面、页面传值、页面刷新（笔记）

1.在原来的窗体中直接跳转用1.超链接&lt;a href="http://www.jb51.net" title="htt"&gt;Welcome&lt;/a&gt;等效于js代码window.location.href="http://www.jb51.net"; //在同当前窗口中打开窗口2、在新窗体中打开页面用：window.open('你所要跳转的页面')...
复制链接

扫一扫