在同一选项卡上加载另一个页面，在地址栏上保持以前的 url
Posted
技术标签:
【中文标题】在同一选项卡上加载另一个页面，在地址栏上保持以前的 url【英文标题】：Load another page on the same tab, Maintain the previous url on the address bar 【发布时间】：2018-02-02 03:10:24 【问题描述】：当用户在我的主页example.com 上并且他从我标题的下拉菜单中手动选择一个国家/地区时，网址是example.com/usa，我希望example.com/usa 在没有example.com 的情况下在同一个选项卡上打开在地址栏中更改为example.com/usa。
okafrica.com 就是这样的网站示例。当您从主页选择喜欢加拿大版[该版的网址为okayafrica.com/country/canada]时，它将在同一选项卡上重新加载并显示加拿大版，地址栏将为okayafrica.com。
有没有办法用 javascript 实现这一点？
【问题讨论】：
使用以下 jquery 脚本：$("html").load(newurl)
听说过路由吗？
@diavolic 能否帮助您提供详细的代码答案。我对javascript一无所知。 :(
@abishek 不，我以前没听说过。请告诉我。
@abhishekkhandait 路由与此无关
【参考方案1】：
假设您使用的是 jQuery，下面的代码就足够了。
$("button").click(function()// any event you can bind on which you want to load new page.
$("html").load("usa", function(responseTxt, statusTxt, xhr)
if(statusTxt == "success")
alert("External content loaded successfully!");
if(statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
);
);
下面是解释上述代码的完整示例 html。
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function()
$("button").click(function()
$("html").load("usa", function(responseTxt, statusTxt, xhr)
if(statusTxt == "success")
alert("External content loaded successfully!");
if(statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
);
);
);
</script>
</head>
<body>
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<button>Get External Content</button>
</body>
</html>
【讨论】：
你能不能用html代码解释一下。现在，“按钮”是类还是 id？我猜demo_test.xt是接下来需要加载的页面的url？ 更新了我的代码，$("html").load("url" ，url是相对于当前页面的相对url。是的url是下一页的url。 当我在 load() 中插入 'quick.html' 之类的内容时，它只是没有像在地址栏中加载 quick.html 时那样正确显示页面。但是当我在 load() 函数中输入“example.com”时，它会弹出错误 0。它没有加载 url。我将处理 url 而不是页面名称。有解决办法吗？ :) 我这样做了 $("html").load("example.com", function(responseTxt, statusTxt, xhr) 仍然错误.. 或者我应该将 'html' 更改为 http？ 阅读和学习如何：api.jquery.com/load（提示：示例url后面没有分号，html是插入加载内容的元素，“url”您加载的域必须是同一个域，否则由于跨站点脚本而失败。网址可以是相对的 (usa)、根相对的 (/usa) 或绝对的 (http://example.com/usa) 查找！）以上是关于在同一选项卡上加载另一个页面，在地址栏上保持以前的 url的主要内容，如果未能解决你的问题，请参考以下文章
图像在 Chrome 选项卡上加载正常，但在 React 代码中返回 403