Javascript 如何更改“父”框架的 URL？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4361479/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I change the URL of the "parent" frame?
提问by ubiquibacon
I have a website which I host myself. I do not have a static IP address so I have all traffic for my domain forwarded with masking to my DDNS account. The resulting page looks like this...
我有一个自己托管的网站。我没有静态 IP 地址，因此我的域的所有流量都通过屏蔽转发到我的 DDNS 帐户。结果页面看起来像这样......
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>mydomianname.com</title>
</head>
<frameset rows="100%,*" border="0">
<frame src="http://myddns.dyndns.org/mydomainname" frameborder="0" />
<frame frameborder="0" noresize />
</frameset>
</html>
How can I update the URL of the "parent" frame as users navigate within the "child" frame?
当用户在“子”框架内导航时，如何更新“父”框架的 URL？
UPDATE: Success?
更新：成功？
I have tried doing this with javascript but had an issue getting the correct hrefto my javascript function with out having adverse side effects (having two windows open up, having my main window go to the wrong location, or making it so the back button didn't work right). All I needed was an attribute of my atag to hold a value that I could use in my javascript, but would do nothing else at all. Adding the attributed valueevent though it is not a native attribute to the atag works great.
我曾尝试使用 javascript 执行此操作，但是在正确href使用我的 javascript 函数时遇到了问题，而不会产生不利的副作用（打开两个窗口，让我的主窗口转到错误的位置，或者使后退按钮没有“工作正常）。我所需要的只是我的a标签的一个属性来保存一个我可以在我的 javascript 中使用的值，但什么都不做。添加属性value事件虽然它不是a标签的本机属性，但效果很好。
The atag...
该a标签...
<a onclick="url_update(this);" value="test/test.html" href="javascript:void(0);">test link</a>
and the javascript function...
和 javascript 函数...
function url_update(element){
base_url = 'http://mydomain.com/';
window.parent.location.href = base_url + element.getAttribute('value');
}
the resulting updated URL is...
结果更新后的 URL 是...
http://mydomain.com/test/test.html
... and there are none of the previously mentioned side effects.
...并且没有前面提到的副作用。
The only "side effect" that I would like to fix is display of the link in the info bar at the bottom of a browser window.Right now it says javascript:void(0);because that is what is written in my hrefattribute, but I would like it to show the updated URL when the link is hovered over... any thoughts?
我想修复的唯一“副作用”是在浏览器窗口底部的信息栏中显示链接。现在它说javascript:void(0);因为这是我的href属性中写的内容，但我希望它在链接悬停时显示更新的 URL...有什么想法吗？
It would be even better if I could scrap all of this javascript and use IIS 7 URL Rewrite 2.0 to do this instead... but I have yet to master the black art of URL rewriting.
如果我能废弃所有这些 javascript 并使用 IIS 7 URL Rewrite 2.0 来做这件事，那就更好了……但我还没有掌握 URL 重写的魔法。
回答by The Scrum Meister
javascript:
javascript:
window.top.location = 'anther url'
--UPDATE to your updated question
- 更新您更新的问题
use element.getAttribute('value')instead of element.value
使用element.getAttribute('value')代替element.value
--UPDATE #2
Use the href attribute, however, add a return false;to the onclick function:
--UPDATE #2 使用 href 属性，但是，将 a 添加return false;到 onclick 函数：
<a onclick="url_update(this);return false;" value="test/test.html" href="test/test.html">test link</a>
Once you are doing that, you might aswell skip the value attribute and just use the href property, update your url_update function to use element.hrefinstead of element.value
一旦你这样做了，你也可以跳过 value 属性，只使用 href 属性，更新你的 url_update 函数来使用element.href而不是element.value
回答by Mark At Ramp51
It's hard to tell from your question exactly which frames are doing what, but if The Scrum Meister's solution works for you, than you can easily implement what you want by adding this to each of your A tags.
很难从您的问题中准确判断哪些框架在做什么，但是如果 Scrum Meister 的解决方案适合您，那么您可以通过将其添加到每个 A 标签来轻松实现您想要的。
target="_top"
Your example modified.
您的示例已修改。
<a href="test/test.html" target="_top">test link</a>
You could also do this with jquery... On the page where all A tags should have target="_top" you can implement the following jquery code on the page and it will dynamically add the target to all links.
你也可以用 jquery 做到这一点......在所有 A 标签都应该有 target="_top" 的页面上，你可以在页面上实现以下 jquery 代码，它会动态地将目标添加到所有链接。
<script language="javascript" type="text/javascript">
$(function()
{
$("A").attr("target","_top");
});
</script>
That is assuming that you have normail A tags with the href attribute, you can get rid of the onclick all together, no other javascript is required with the target solution.
那是假设您有带有 href 属性的 normail A 标签，您可以一起摆脱 onclick，目标解决方案不需要其他 javascript。
回答by millebii
First you need to be on the same domain... otherwise for security reasons you can not change it. Declare and call this function in your child frame
首先你需要在同一个域...否则出于安全原因你不能改变它。在您的子框架中声明并调用此函数
function change(theUrl){
window.parent.reloadContent(theUrl);
}
In your parent have the following function :
在你的父母有以下功能：
function reloadContent(theUrl){
if (theUrl != ""){
document.getElementById("frameID").src= theUrl ;
}
}
