Home >Backend Development >PHP Tutorial >使用iframe提交form,如何把值返回到上一层?

使用iframe提交form,如何把值返回到上一层?

WBOY
WBOYOriginal
2016-06-06 20:25:371679browse

1.如何使iframe里的信息,传到div那?
2.如果不使用iframe而使用div的话,怎么让div里的form进行提交且不跳转?
3.文件提交到服务器后,如何获取他的地址,并返回到input里?

<code>
    <div>
        <input type="text">
    </div>
        <iframe scr="./upload.php"></iframe>
</code>

upload.php:

<code><form action="xxx.php" method="post" enctype="multipart/form-data">
    <input type="file" name="file" onchange="uploadImg()">
</form>
    <script>
    //上传图片
    function uploadImg(){
        $("form:first").trigger("submit")
    }
</script></code>

回复内容:

1.如何使iframe里的信息,传到div那?
2.如果不使用iframe而使用div的话,怎么让div里的form进行提交且不跳转?
3.文件提交到服务器后,如何获取他的地址,并返回到input里?

<code>
    <div>
        <input type="text">
    </div>
        <iframe scr="./upload.php"></iframe>
</code>

upload.php:

<code><form action="xxx.php" method="post" enctype="multipart/form-data">
    <input type="file" name="file" onchange="uploadImg()">
</form>
    <script>
    //上传图片
    function uploadImg(){
        $("form:first").trigger("submit")
    }
</script></code>

upload.php 在保存好文件之后, 将文件的路径以下面这样的形式返回给上层.

<code><?php //假设保存后的文件路径, 保存在 $filePath 变量里
$filePath = '123.jpg';
?>
<script>parent.$('input').val("<?php echo $filePath;?>");</script></code>

简单来讲就是通过 parent 然后就可以访问iframe所在的那个页面中的内容了.


在线演示地址: https://xqin.net/temp/up.html

up.php 的代码如下(此处只是演示,故只输出当前时间):

<code class="php"><?php $filePath = time();
?>
<script>parent.document.getElementById('result').value = "<?php echo $filePath;?>";</script>
上传完成! <?php echo $filePath; ?></code>

之前在做chrome插件的时候,碰到过iframe与外部通讯,不知道有没有帮助

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

https://github.com/xwartz/xwartz.github.com/issues/1

h5web通信,http://www.cnblogs.com/ATree/archive/2012/03/07/html5-web-messaging.html

iframe裡面上傳成功後, 把值寫到iframe裡面.

event掛到window.onload裡面, 然後去iframe裡面拿data.

iframe里的window对象不是可以被外部拿到嘛,在外部弄一个函数,在iframe里提交的时候阻止默认事件然后调用外部的callback

异步提交form不就行了

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn