formData

1.概念：formData可以用来管理表单数据

（1）formData仅支持post请求

（2）不需要设置请求头，浏览器会自动检测，帮我们设置

（3）通过new Formdata()来创建实例

（4）这个formData可以作为send的参数

2.前端代码

<body>
    <form id="form">
        用户名：<input type="text" name="username"> <br>
        密码： <input type="password" name="password"> <br>
        确认密码： <input type="text" name="repassword"> <br>
        <input type="button" value="提交" id="btn">

    </form>
    <script>
        $(function () {
            var btn = document.getElementById('btn')
            btn.onclick = function () {
                var xhr = new XMLHttpRequest()
                xhr.open("post", "aa.php")
                var form = document.getElementById('form')        //获得form元素
                var formData = new FormData(form)                 //通过new Formdata()来创建实例
                xhr.send(formData)                                //formData可以作为send的参数
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                        if (xhr.status === 200) {
                            console.log(xhr.responseText)
                        }
                    }
                }
            }
        })
    </script>

</body>

</html>

3.后端代码

<?php
echo json_encode($_POST);
?>

 

posted on 2019-10-08 00:31  宅到深夜  阅读(362)  评论(0)    收藏  举报