js 返回上一页和刷新

最新推荐文章于 2023-12-26 10:55:11 发布
转载 最新推荐文章于 2023-12-26 10:55:11 发布 · 619 阅读 · 1

      var i = 5;
        var intervalid;
        var xm = document.getElementById("xm");
        intervalid = setInterval("fun()", 1000);
        function fun() {
            if (i == 0){
                //window.location.href = "/";
history.go(-1);
                clearInterval(intervalid);
            }
            xm.innerHTML = i;
            i--;
        }

1. Javascript 返回上一页history.go(-1), 返回两个页面: history.go(-2);

 

2. history.back().

 

3. window.history.forward()返回下一页

 

4. window.history.go(返回第几页,也可以使用访问过的URL) 

例:

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

 

response.Write("<script language=javascript>")

response.Write("if(!confirm('完成任务?')){history.back();}")

response.Write("</script>")

response.Write("<script language=javascript>history.go(-1);</script>")

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

 

页面跳转:onclick="window.location.href='list.aspx'" 

P.S.

小技巧(JS引用JS):

<script type=text/javascript>

<!--

if (typeof SWFObject == "undefined") {

document.write('<scr' + 'ipt type="text/javascript" src="/scripts/swfobject-1.5.js"></scr' + 'ipt>');}

//-->

</script> 

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.javaeye.com">  

其中20指隔20秒后跳转到http://www.javaeye.com页面

 

3.页面自动刷新js版

<script language="JavaScript">

function myrefresh()

{

       window.location.reload();

}

setTimeout('myrefresh()',1000); //指定1秒刷新一次

</script> 

ASP.NET如何输出刷新父窗口脚本语句

1.   this.response.write("<script>opener.location.reload();</script>");

 

2.   this.response.write("<script>opener.window.location.href = opener.window.location.href;</script>");

 

 

3.   Response.Write("<script language=javascript>opener.window.navigate(''你要刷新的页.asp'');</script>") 

JS刷新框架的脚本语句 www.2cto.com

 

//如何刷新包含该框架的页面用

<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>

 

如果想关闭窗口时刷新或者想开窗时刷新的话，在<body>中调用以下语句即可。

 

<body onload="opener.location.reload()"> 开窗时刷新

<body onUnload="opener.location.reload()"> 关闭时刷新

 

<script language="javascript">

window.opener.document.location.reload()

</script> 

js 返回上一页和刷新 的代码
12-13
本文将详细介绍JavaScript中的各种方法来实现返回上一页、刷新页面以及相关的页面跳转技术。 首先，我们来看如何实现“返回上一页”： 1. `history.go(-1)`：这个方法将浏览器的历史记录向后移动一步，相当于点击...
Js实现返回上一页（页面 刷新和不刷新）
热门推荐
欢迎交流PHP和前端知识QQ：634487911
06-28 6万+
返回上一页不刷新：1.a标签&lt;a href="&lt;a href="javascript :history.back(-1)"&gt;返回上一页&lt;/a&gt; 或 &lt;a href="javascript :;" onClick="javascript :history.back(-1);"&gt;返回上一页&lt;/a&gt;2.按钮&lt
js切换窗口不刷新只是激活切换窗口
u014708123的博客
12-26 775
窗口切换页面不刷新的原理，首先要同源，其次是指定window.name;方法就是调用window.open();
JS控制，返回上一页之后强行刷新一次
望月思灵
06-14 8269
网站建设过程中，提交页面后我们经常要用到window.history.go(-1)返回上一页，因为页面的缓存功能，我们只能返回上次操作的页面，但在删除等操作中，我们希望实时看到删除项目后的页面，这就要用到同时刷新技术，下面我们总结总结一下常用的几种window.history.go(-1)返回页面后实时刷新技术。返回上一页代码:返回上一页  1.强制载入后刷新一次我们可以仿照C++中解决头文件重复
js - 实现页面跳转与刷新 - 总结
xiannverhaha的博客
11-29 1450
其实 .href 可以省略window.location 和 window.location.href 实现的效果是一样的；不同之处在于 window.location 返回的是对象，如果没有.href，它的默认参数就是href。
js返回上一页并刷新的多种实现方法
12-11
本文将详细讨论如何实现“返回上一页并刷新”的多种方法，以及与之相关的JavaScript页面跳转、刷新和自动更新技术。 首先，让我们看下如何在JavaScript中实现“返回上一页并刷新”： 1. 使用`history.go(-1)`结合`...
html页面跳转返回不要刷新,javascript跳转与返回和刷新页面的实例代码
weixin_34916566的博客
06-04 2555
javascript中window.open()与window.location.href的区别window.open(‘index.html') 表示新增一个窗口打开 index.html 这个页面，并不刷新location.href(‘index.html') 表示在当前窗口重定向到新页面，打开并刷新 index.html 这个页面window.location 是 window 对象的属性，...
js无刷新改变页面url
01-12
js无刷新改变页面url ，通过js处理，页面请求在跳转回来，页面无刷新感觉，增加用户体验
js修改url但不刷新页面
qq_35451480的博客
12-02 1900
js里面动态修改url地址，但是不想刷新页面 window.history.pushState({}, 0, window.location.href + '?type=china'); 如下,给url添加mode参数，或者修改mode参数 function changeURL(mode){ window.history.pushState({}, 0, window.location.href.split('?mode=')[0] + '?mode=' + mode); }
JS location.href不重新刷新当前页面
夹扣的博客
05-25 1万+
前言： 前两天在工作中遇到location.href刷新页面不成功的问题，于是在此记录一下。 我的需求： 用Ajax请求后端返回数据和跳转的链接，其中返回的链接有可能是新的url也有可能是当前页面地址栏上的url。刚开始我直接使用window.location.href=url.来实现，即无论返回的什么url我都用window.location.href帮我重定向。 但是后来在测试的时候出...
通过js实现更改路由页面不刷新方法
亭有枇杷树
05-07 4996
因为项目需要实现更改路由，但是为了确保页面动画不受影响，所以要保证页面不能够刷新！ <!--点击登录按钮更改url--> <script type="text/javascript"> function LoginChangeUrl(){ <!--获取当前url--> var url=window.location.href ...
JS页面跳转和刷新的几种方式
稻草人
09-17 1万+
1、跳转常用方法：window.location.href="index.php"; window.history.back(-1);//类似于按钮，参数是负几，就后退几次。 window.navigate("index.jsp"); //navigate对象包含有关浏览器的信息，也可以作为页面跳转，后面直接加要跳转的地方。 self.location.href=index.htm;
javascript实现点击链接后页面不刷新不跳转
独骥马车
11-30 1107
实现点击链接后页面不刷新不跳转? &lt;script language="javascript" type="text/javascript"&gt;   function deleteHrefs(){     var x = document.getElementsByTagName("a");     for(var i = 0;i&lt;x.length;i++){         x[i...
js 返回上一页同时强制刷新上一页
最新发布
10-27
<think>首先，用户的问题是："我想查找使用JavaScript返回上一页并强制刷新上一页的方法"。用户指定了要使用JavaScript实现返回上一页并强制刷新上一页的方法。 系统级指令要求： - 所有行内数学表达式必须使用$...$格式。 - 独立公式使用$$...$$并单独成段。 - LaTeX语法正确。 - 使用中文回答。 - 生成相关问题。 - 回答中引用的段落末尾自然地添加引用标识，如[^1]。 用户还提供了三个引用： - 引用[1]: 讨论了微信内置浏览器返回上一页强制刷新的问题。 - 引用[2]: 解释了popstate事件和JavaScript环境的变化。 - 引用[3]: 介绍了Safari浏览器的bfcache和如何使用onpageshow事件检测页面是否从缓存加载。 用户的问题焦点是：如何使用JavaScript实现返回上一页并强制刷新上一页。用户强调"强制刷新上一页"，意思是当用户点击浏览器后退按钮时，确保上一页被刷新，而不是从缓存加载。 从引用中提取关键点： - 引用[1]: 微信浏览器在返回时强制刷新，影响用户体验；用户想要保留状态。 - 引用[2]: popstate事件只在同一个JavaScript环境中触发，如果页面重新加载，则不会触发。 - 引用[3]: Safari有bfcache，使用onpageshow事件和persisted属性判断页面是否从缓存加载。 用户的需求是相反的：用户想要强制刷新上一页，而不是避免刷新。用户说："使用JavaScript返回上一页并强制刷新上一页"，这可能意味着在当前页面执行JavaScript来导航回上一页并强制刷新它。 解读用户问题： - "使用JavaScript返回上一页"：可能是通过JavaScript代码触发后退操作。 - "并强制刷新上一页"：确保当导航到上一页时，它被完全刷新，而不是从缓存加载。 所以，我需要提供一种方法： 1. 在当前页面使用JavaScript导航到上一页。 2. 确保上一页在加载时被强制刷新。 常见方法是使用`window.location.href = document.referrer;` 或 `history.go(-1);` 来返回上一页，但这通常不会强制刷新，因为浏览器可能使用缓存。 为了强制刷新，我们可以使用参数或修改URL来绕过缓存。 一种方法是： - 使用`window.location.replace()` 或 `window.location.assign()` 导航到上一页的URL，但添加一个时间戳参数来强制不使用缓存。 但用户说"返回上一页"，意思是导航历史中的上一页。我们需要知道上一页的URL。 在JavaScript中，`document.referrer` 返回上一个页面的URL，但它是只读的，并且可能为空或不准确。 `history.back()` 或 `history.go(-1)` 用于导航回上一页，但它们不会强制刷新；浏览器可能会从缓存加载。 为了强制刷新，我们可以： 1. 在当前页面捕获上一页的URL。 2. 然后导航到那个URL，但添加一个参数来强制刷新，例如`?timestamp=当前时间戳`。 但`document.referrer` 只能在页面加载时访问，并且可能不是最新的。 另一个方法是使用`window.location.reload(true)`，但那刷新当前页面，不是上一页。 用户指定"返回上一页"，所以我们需要触发后退操作并确保上一页刷新。 从引用[3]，我们知道在Safari等浏览器中，页面可能从bfcache加载而不刷新。事件如`onpageshow` 可以用来检测并从缓存中刷新。 但用户是想要在上一页被访问时强制刷新它，所以我们不能直接在上一页代码中修改；我们需要在当前页面触发一个操作。 或许方法是：当用户在当前页面执行某个动作（如点击按钮）时，我们模拟后退导航并确保上一页刷新。 标准方法是： - 使用JavaScript获取上一页的URL（通过`document.referrer`）。 - 然后使用`window.location.href = document.referrer + '?refresh=' + new Date().getTime();` 来强制加载新副本。 但`document.referrer` 可能为空或不可靠。 如果知道上一页的URL，我们可以直接导航。 在代码中，我们可以写： ```javascript window.location.href = document.referrer + '?refresh=' + new Date().getTime(); ``` 或者，使用`replace` 来避免添加历史记录： ```javascript window.location.replace(document.referrer + '?refresh=' + new Date().getTime()); ``` 但`document.referrer` 只在页面从链接导航来时可用；如果用户直接输入URL或通过书签，则为空。所以需要检查。 为了更可靠，我们可以使用`history.back()` 但添加一个事件在上一页加载时刷新它。但这需要在上一页的代码中实现。 用户的问题是从当前页面的角度触发这个行为。 或许更好的方法是：在当前页面，我们不使用后退，而是直接导航到上一页的URL并强制刷新。 步骤： 1. 获取上一页的URL：`let prevPageUrl = document.referrer;` 2. 如果`prevPageUrl` 为空，则无法操作；否则，添加一个参数来强制刷新。 3. 导航到那个URL：`window.location.href = prevPageUrl + '?refresh=' + new Date().getTime();` 或者使用`window.location.replace(prevPageUrl + '?refresh=' + new Date().getTime());` 来替换当前历史记录，模拟后退。 但这不是真正的后退；它添加了一个新条目或替换。 如果使用`history.back()`，我们无法控制刷新。 从引用[3]，在目标页面（上一页），我们可以使用`onpageshow` 事件来检查`event.persisted` 属性。如果为true，表示从缓存加载，我们可以调用`location.reload(true)` 来强制刷新。 但这需要在上一页的代码中实现，不是从当前页面触发。 用户的问题是："使用JavaScript实现返回上一页并强制刷新上一页的方法"，这暗示从当前页面执行代码。 所以，我应该在回答中澄清： - 要强制刷新上一页当它被访问时，需要在上一页的JavaScript中添加代码。 - 或者，从当前页面导航回上一页并确保它刷新。 综合方法： - 方法1：在当前页面，使用`window.location.replace(document.referrer + '?refresh=' + new Date().getTime());` 直接导航到上一页URL并强制刷新。 - 方法2：在上一页的代码中，添加检测缓存并刷新的逻辑。 用户可能控制上一页的代码，也可能不控制。但问题没有指定。 在回答中，我可以提供两种场景。 但用户说"返回上一页并强制刷新上一页"，所以 focus on triggering from current page. 现在，生成回答结构： - 用中文回答。 - 结构清晰，逐步解释。 - 引用相关部分。 - 最后添加相关问题。 引用用户提供的引用： - 引用[1] 关于微信浏览器的问题。 - 引用[2] 关于popstate事件。 - 引用[3] 关于bfcache和onpageshow。 这些引用更多是关于避免刷新，但可以借鉴。 例如，从引用[3]，我们可以使用类似技术在上一页检测是否从缓存加载。 但对于强制刷新，我们可以主动添加参数。 回答内容： 1. 解释问题。 2. 提供方法。 3. 给出代码示例。 4. 讨论注意事项。 方法： - 使用`window.location.replace()` 或 `assign()` 导航到上一页URL，添加时间戳参数强制刷新。 代码： ```javascript if (document.referrer) { var newUrl = document.referrer + (document.referrer.indexOf('?') === -1 ? '?' : '&') + 'refresh=' + new Date().getTime(); window.location.replace(newUrl); // 或 window.location.href = newUrl; } else { history.back(); // 后退但可能不刷新 } ``` - 或者，在上一页添加代码来强制刷新当从缓存加载： ```javascript window.addEventListener('pageshow', function(event) { if (event.persisted) { location.reload(true); // true 参数强制从服务器加载，绕过缓存 } }); ``` 但第二个方法需要在上一页实现。 对于用户的问题，如果他们控制上一页，建议添加代码在那里；如果不控制，则从当前页面导航。 在回答中，提供选项。 现在，生成相关问题。 系统要求生成相关问题。 相关问题示例： 1. 如何避免浏览器缓存页面？ 2. 不同浏览器处理页面缓存的差异？ 3. 如何检测页面是否从缓存加载？ 4. JavaScript导航方法的比较：location.replace vs history.back。 5. 微信内置浏览器中如何处理页面返回问题？ 确保回答中用中文。 最后，引用标识：如果引用段落，添加[^n]。 在回答中，引用提到的引用。 </think>### 使用 JavaScript 返回上一页并强制刷新上一页的方法 在 Web 开发中，当用户从当前页面返回到上一页时，浏览器默认可能从缓存加载页面，导致页面状态未被刷新（例如 AJAX 数据丢失或滚动位置重置）。您需求的核心是：**通过 JavaScript 主动触发返回上一页的操作，并确保上一页加载时被强制刷新（即绕过浏览器缓存，重新从服务器加载）**。以下方法基于 JavaScript 实现，并结合了浏览器历史记录管理和缓存控制机制。方法分为两种场景：一是从当前页面触发返回并强制刷新上一页；二是在上一页代码中添加检测逻辑实现自动刷新。我会逐步解释并提供代码示例。 --- ### 方法 1: 从当前页面触发返回上一页并强制刷新（推荐） 此方法适用于您控制当前页面代码的场景。核心思路是： 1. 获取上一页的 URL（通过 `document.referrer`）。 2. 添加时间戳参数来强制浏览器忽略缓存并重新加载。 3. 使用 `window.location.replace()` 或 `window.location.href` 导航到修改后的 URL，模拟“返回”操作。 **JavaScript 代码示例：** ```javascript // 在当前页面执行此函数（例如绑定到按钮点击事件） function goBackAndForceRefresh() { if (document.referrer) { // 获取上一页 URL 并添加随机参数（如时间戳）来强制刷新 var separator = document.referrer.includes('?') ? '&' : '?'; var refreshUrl = document.referrer + separator + 'timestamp=' + Date.now(); // 使用 replace() 替换当前历史记录，模拟后退操作 window.location.replace(refreshUrl); } else { // 如果 document.referrer 不可用（如直接访问），则使用 history.back() 作为备选 history.back(); // 注意：history.back() 可能无法强制刷新，但能确保导航回上一页 } } ``` **代码说明：** - `document.referrer`：返回上一页的 URL，但仅在页面通过链接导航时可用（例如用户从上一页点击链接进入当前页）。如果页面是直接打开或通过书签访问的，`document.referrer` 可能为 `空字符串`，需要处理异常[^2]。 - 添加时间戳参数（如 `?timestamp=1717027200000`）：这会让浏览器认为 URL 已更改，从而跳过缓存并强制从服务器重新加载页面。 - `window.location.replace()`：与 `history.back()` 不同，此方法不会添加新历史记录，而是替换当前条目，效果类似于“返回”但更可控。使用它能避免历史记录堆栈污染。 - **优势**：简单高效，兼容大多数现代浏览器（包括 Chrome、Firefox、Safari）。 **注意事项：** - **微信内置浏览器处理**：微信浏览器在返回时可能强制刷新页面影响体验[^1]，但此方法通过添加参数主动触发刷新，能避免微信的默认行为。 - **兼容性**：如果 `document.referrer` 为空，代码回退到 `history.back()`，但这可能无法强制刷新。建议在上一页也添加刷新逻辑（见方法 2）。 - **参数处理**：确保添加的参数不影响原有页面功能（例如使用无害的 URL 参数如 `refresh` 或 `timestamp`）。 --- ### 方法 2: 在上一页添加自动刷新逻辑（适用于控制上一页代码的场景） 如果您能修改上一页的代码，可以在上一页中检测用户是否从缓存加载页面（例如通过浏览器后退），并自动触发刷新。核心是利用 `pageshow` 事件和 `persisted` 属性检测缓存状态。 **JavaScript 代码示例（添加到上一页的脚本中）：** ```javascript // 在上一页的 JavaScript 中添加此事件监听器 window.addEventListener('pageshow', function(event) { if (event.persisted) { // 如果页面从缓存加载（如 bfcache），则强制刷新 location.reload(true); // true 参数表示从服务器加载，绕过缓存 } }); ``` **代码说明：** - `pageshow` 事件：在页面显示时触发（包括首次加载和从缓存恢复），比 `load` 事件更可靠，因为它每次窗体显示都会执行[^3]。 - `event.persisted`：布尔值属性，如果为 `true` 表示页面从浏览器缓存（如 Safari 的 bfcache）加载。 - `location.reload(true)`：参数 `true` 强制浏览器忽略缓存，直接从服务器重新加载页面。 - **优势**：无需在当前页面操作，直接在上一页实现无缝刷新。特别适用于 Safari 等支持 bfcache 的浏览器[^3]。 **注意事项：** - **浏览器支持**：`pageshow` 和 `persisted` 在大多数现代浏览器中可用（IE10+），但需测试目标环境。 - **微信浏览器兼容性**：微信内置浏览器基于 WebKit，支持此方法，能避免返回时的强制刷新问题[^1]。 - **popstate 事件限制**：`popstate` 事件只在同一 JavaScript 环境中触发（页面未重新加载），因此不适用于检测缓存加载[^2]。 --- ### 推荐方案 - **如果您控制当前页面和上一页的代码**：结合两种方法。在上一页添加方法 2 的代码确保缓存刷新；在当前页面使用方法 1 作为主动触发机制。 - **性能影响**：强制刷新会增加服务器负载，仅在必要时使用（例如页面数据需实时更新）。 - **测试建议**：在目标浏览器（如 Chrome、Safari、微信浏览器）中测试，使用开发者工具的 Network 面板验证是否绕过缓存。 如果上述方法无效，请提供更多上下文（例如具体浏览器环境）。 --- ### 相关问题 1. 如何避免浏览器缓存导致页面状态丢失？ 2. 不同浏览器（如 Chrome、Safari、微信）处理页面历史记录有什么差异？ 3. 如何使用 JavaScript 检测页面是否从缓存加载？ 4. 微信内置浏览器中如何优化页面返回体验？ 5. AJAX 数据持久化在页面导航中的最佳实践是什么？ [^1]: 微信内置浏览器在返回上一页面时可能强制刷新，影响用户体验，尤其是在含有 AJAX 的页面中。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值