AJAX-----10iframe模拟ajax文件上传效果原理2

Posted 2020-08-17 夺命雷公狗

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了AJAX-----10iframe模拟ajax文件上传效果原理2相关的知识，希望对你有一定的参考价值。

在实际开发中其实我们可以给用户一些提示，比如上传成功或者上传失败，废话不多说，走码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="jq183.js"></script>
    <script>
        function ajaxup(){
            var ifname = \'up\'+Math.random();
            $("<iframe name=\'"+ ifname +"\' height=\'0\' width=\'0\' frameborder=\'0\' ></iframe>").appendTo($(\'body\'));
            $(\'form:first\').attr(\'target\',ifname);
            //return false;
        }
    </script>
</head>
<body>
    <p id="mess"></p>
    <form action="9.php" method="post" enctype="multipart/form-data" onsubmit="return ajaxup();">
        <input type="file" name="pic"> <br> <br>
        <input type="submit" value="GO">
    </form>
    <iframe src="" frameborder="0"></iframe>
</body>
</html>

<?php
    if(empty($_FILES)){
        exit(\'No file\');
    }

    $errs = $_FILES[\'pic\'][\'error\'] == 0 ? \'success\':\'error\';
    echo "<script> parent.document.getElementById(\'mess\').innerHTML = \'$errs\' </script>";

以上是关于AJAX-----10iframe模拟ajax文件上传效果原理2的主要内容，如果未能解决你的问题，请参考以下文章

AJAX-----11iframe模拟ajax文件上传效果原理3

Ajax 文件下载问题

Ajax 到控制器并在 IFrame 中返回文件

iframe实现Ajax文件上传效果示例

ajax提交formData iframe springmvc 上传文件页面是通过iframe嵌入的html

Ajax上传文件