指定iframe的内容而不是页面的src属性 [英] Specifying content of an iframe instead of the src attribute to a page

查看:593
本文介绍了指定iframe的内容而不是页面的src属性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我目前正在处理一个包含一些文件输入以上传图片的表格.这些输入有一个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类似于(不包括htmlheadbody标记)

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

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆