jQuery_serialize的用法

jQuery_serialize(form表单序列化)用于在前端要传很多值往后端的时候:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/static/jquery-3.2.1.min.js"></script>
</head>
<body>
<form name="myForm" action="http://www.365mini.com" method="post">
    {% csrf_token %}
    <input name="uid" type="hidden" value="1" />
    <input name="username" type="text" value="张三" />
    <input name="password" type="text" value="123456" />
    <select name="grade" id="grade">
        <option value="1">一年级</option>
        <option value="2">二年级</option>
        <option value="3" selected="selected">三年级</option>
        <option value="4">四年级</option>
        <option value="5">五年级</option>
        <option value="6">六年级</option>
    </select>
    <input name="sex" type="radio" checked="checked" value="1" />男
    <input name="sex" type="radio" value="0" />女
    <input name="hobby" type="checkbox" checked="checked" value="1" />游泳
    <input name="hobby" type="checkbox" checked="checked" value="2" />跑步
    <input name="hobby" type="checkbox" value="3" />羽毛球
    <input name="btn" id="btn" type="button" value="点击" />
{#<button class="send_ajax">send_Ajax</button><span class="login_error"></span>#}
<script>
    $("#btn").click(function () {
        $.ajax({
            url:"/demo2/",
            type:"POST",
            data:$("form").serialize(),
            success:function (data) {
                alert(data)
            }
        })
    })

</script>
</body>
</html>

后端代码:

 

posted @ 2017-11-14 20:21 前方、有光 阅读(...) 评论(...) 编辑 收藏