借助于iframe无刷新提交表单
程序员文章站
2022-03-11 18:31:10
...
一直以为用ajax可以实现无刷新上传文件,可事实证明是不可能的,至少是目前。
现在用iframe实现无刷新上传文件
原理:把form的变量传递页面指到iframe,所有看起来页面没有刷新,实际上iframe实现的刷新,只是看不到
html表单内容如下:
<form action="test.php" id="file_form" method="post" enctype="multipart/form-data" target="call_response">
<input type="file" id="file" name="test" />
<input type="submit" name="dosubmit" value="提交" />
<iframe name="call_response" style="display: none"></iframe>
</form>
将form的target指向iframe的name值,通过iframe上传表单内容,上传成功后,我们通过javascript来将表单重置:
<script type="text/javascript"> function resetForm(msg) { if (msg) { document.getElementById("tips").innerHTML = msg; } document.getElementById("file_form").reset(); } </script>
服务端脚本test.php在返回的时候可以输出如下内容调用客户端javascript函数:
<?php
echo <<<EOF
<script type="text/javascript">window.parent.resetForm('上传成功');</script>
EOF;
转载于:https://blog.51cto.com/suiwnet/1439024