Javascript 使用新的 url 重新加载 iframe src/location 在 Safari 中不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8082827/
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
Reload iframe src / location with new url not working in Safari
提问by Matt
I have a page that loads with initially just a form within an iframe, something like this:
我有一个页面,最初只加载了 iframe 中的一个表单,如下所示:
<iframe id="oIframe" ...src='somePage>'
<form ... />
</iframe>
<iframe id="oIframe" ...src='somePage>'
<form ... />
</iframe>
When you click a button in the form, some javascript is invoked that builds a url and then I want to do the following:
当您单击表单中的按钮时,会调用一些 javascript 来构建一个 url,然后我想执行以下操作:
frame.src = 'somePage?listId=1';
frame.src = 'somePage?listId=1';
This works in IE to "reload" the frame with the new contents. However, in Safari this does not work.
这适用于 IE 以使用新内容“重新加载”框架。但是,在 Safari 中这不起作用。
I have jQuery available, but I don't want to replace the existing iframe because there are events attached to it. I also can not modify the id of the iframe because it is referenced throughout the application.
我有可用的 jQuery,但我不想替换现有的 iframe,因为它有附加的事件。我也无法修改 iframe 的 id,因为它在整个应用程序中都被引用。
I have seen some similar issues but no solutions that seem to work well for my exact issue.
我见过一些类似的问题,但没有解决方案似乎对我的确切问题有效。
Any assistance anyone can provide would be great!
任何人都可以提供的任何帮助都会很棒!
采纳答案by Matt
I found a better solution (albeit not paticularly eloquent) for this using jQuery.ajax:
我使用 jQuery.ajax 找到了一个更好的解决方案(虽然不是特别雄辩):
jQuery.ajax({
type: 'GET',
url: "/somePage?someparms",
success: function() {
frameObj.src = "/somePage?someparms";
}
});
This forces the DOM to be read within the frame object, and reloads it once the server is ready to respond.
这会强制在框架对象中读取 DOM,并在服务器准备好响应时重新加载它。
回答by Dubas
Some browsers don't use "src" when calling the javascript object directly from the javascript hierarchy and others use "location" or "href" instead of "src" to change the url . You should try these two methods to update your iframe with a new url.
一些浏览器在直接从 javascript 层次结构调用 javascript 对象时不使用“src”,而其他浏览器使用“location”或“href”而不是“src”来更改 url 。您应该尝试这两种方法来使用新的 url 更新 iframe。
To prevent browser cache add a pseudo-random string like a number and timestamp to the url to prevent caching. For example add "new Date().getTime()" to your url.
要防止浏览器缓存,请在 url 中添加一个伪随机字符串(如数字和时间戳)以防止缓存。例如,将“new Date().getTime()”添加到您的网址。
Some calling examples:
一些调用示例:
document.getElementById(iframeId).src = url;
or
或者
window.frames[iframeName].location = url;
I recommend the first option using document.getElementById
我推荐使用 document.getElementById 的第一个选项
Also you can force the iframe to reload a page using
您也可以强制 iframe 使用
document.getElementById(iframeId).reload(true);
回答by Bartosz Strutyński
So the answer is very simple:
1. put a <div id="container"> </div>
on your page
2. when reload needed use following jQuery:
所以答案很简单:
1.<div id="container"> </div>
在你的页面上放一个
2. 当需要重新加载时,使用以下 jQuery:
$("#container").empty();
$("#container").append("<iframe src='" + url + "' />");
and that's it. Of course there is more elegant way of creating DOM with jQuery but this gives the idea of "refreshing" iframe. Works in FF18, CH24, IE9, O12 (well it's jQuery so it will work almost always :)
就是这样。当然,使用 jQuery 创建 DOM 有更优雅的方式,但这给出了“刷新”iframe 的想法。适用于 FF18、CH24、IE9、O12(嗯,它是 jQuery,所以它几乎总是可以工作:)
回答by Matt
Well, I was able to find what appears to be a feasible solution -- it's a work in progress, but this is basically what I ended up doing:
好吧,我能够找到似乎可行的解决方案——这是一项正在进行的工作,但这基本上是我最终要做的:
var myFrame = document.getElementById('frame'); // get frame
myFrame.src = url; // set src attribute of original frame
var originalId = myFrame.id; // retain the original id of the frame
var newFrameId = myFrame.id + new Date().getTime(); // create a new id
var newFrame = "<iframe id=\"" + newFrameId + "\"/>"; // iframe string w/ new id
myFrameParent = myFrame.parentElement; // find parent of original iframe
myFrameParent.innerHTML = newFrame; // update innerHTML of parent
document.getElementById(newFrameId).id = originalId; // change id back
回答by Grrbrr404
Try this
尝试这个
form.setAttribute('src', 'somePage?listId=1');