wangdongwei
/
02-用Ajax提交数据.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- form表单用来采集数据 -->
    结论：enctype
    <form>
        <span>用户名</span>
        <input type="text" name="uname">
        <span>密码</span>
        <input type="password" name="password">
        <button>登录</button>
    </form>


    <script src="./js/jquery-1.12.4.min.js"></script>

    <script>
        $(function () {
            $('form').on('submit',function (e) {
                e.preventDefault()
                const str = $(this).serialize()


                $.post('http://www.liulongbin.top:3006/api/form',str,function (res) {
                    console.log(res);
                })


                // 以Ajax方式提交
                // $.ajax({
                //     type:'POST',
                //     url:'http://www.liulongbin.top:3006/api/form',
                //     data:str,
                //     success:function (res) {
                //         console.log(res);
                //     }
                // })
            })
        })
    </script>
</body>
</html>