ajax 上传图片

index.html
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>

</head>

<body>

    <from action="" enctype="multipart/form-data" method="post">

        <a>

            <span>修改头像</span>

            <input type="file" id="fileUp">

        </a>

    </from>

    <script>

        var fileM=document.querySelector("#fileUp");

        $("#fileUp").on("change",function() {

            //获取文件对象，files是文件选取控件的属性，存储的是文件选取控件选取的文件对象，类型是一个数组

            var fileObj = fileM.files[0];

            //创建formdata对象，formData用来存储表单的数据，表单数据时以键值对形式存储的。

            var formData = new FormData();

            formData.append('file', fileObj);

            $.ajax({

                url: "http://localhost:8089/index.php",

                type: "post",

                dataType: "json",

                data: formData,

                async: false,

                cache: false,

                contentType: false,

                processData: false,

                success: function (json_data) {

                    alert("恭喜你！上传成功");

                },

            });

        });

    </script>

</body>

</html>
巴特西

ajax 上传图片

最新文章

热门文章
