指定iframe的内容而不是页面的src属性 [英] Specifying content of an iframe instead of the src attribute to a page
问题描述
我目前正在处理一个包含一些文件输入以上传图片的表格.这些输入有一个onchange()
事件,该事件将图片提交到iframe
,然后将上传的图片动态加载到表单中,并为其修改字段(例如 name 和地理定位).
I'm currently working on a form which includes some file inputs to upload pictures. There is an onchange()
event for those inputs that submits the pictures to an iframe
, then dynamically loads the uploaded pictures into the form, with fields to be modified for them (like name and geo-localization).
由于我无法嵌套表格,因此file_input
也包含在iframe
中.最后,我在另一个iframe
中使用了iframe
.所以我有这样的东西:
Since I can't nest forms, the file_input
is also contained in an iframe
. In the end I use an iframe
inside of another iframe
. So I have something like this:
<form>
<!-- LOTS OF FIELDS!! -->
<iframe src="file_input_url">
<!-- iframe which loads a page of a form with a file input-->
</iframe>
</form>
,并且加载到iframe
中的HTML类似于(不包括html
,head
和body
标记)
and the HTML loaded into the iframe
is something like (excluding the html
, head
and body
tags)
<form target="upload_iframe">
<input type="file" onchange="this.form.submit()">
</form>
<iframe name="upload_iframe"></iframe>
这很好用,除了加载第一个iframe
需要花费几秒钟的事实之外,因此文件输入不会随页面的其余部分一起加载.这在视觉上不是理想的.如果我可以指定iframe
内容而不需要加载另一个页面(由第一个iframe
中的file_input_url
指定),则可以解决.
This works great, except for the fact that it takes a couple seconds to load the first iframe
, so the file input does not load with the rest of the page. This is not visually ideal. I could solve it if I could specify the iframe
content without needing to load another page (specified by file_input_url
in the first iframe
).
是否可以在同一文档中指定iframe
内容,还是只能使用src
属性来指定,从而需要加载另一页?
Is there a way to specify the iframe
content in the same document, or can it only be specified with the src
attribute, requiring the load of another page?
推荐答案
您可以将内容.write()
放入iframe文档中.示例:
You can .write()
the content into the iframe document. Example:
<iframe id="FileFrame" src="about:blank"></iframe>
<script type="text/javascript">
var doc = document.getElementById('FileFrame').contentWindow.document;
doc.open();
doc.write('<html><head><title></title></head><body>Hello world.</body></html>');
doc.close();
</script>
这篇关于指定iframe的内容而不是页面的src属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!