表单提交

最新推荐文章于 2021-02-23 13:34:08 发布

流浪者的短匕

最新推荐文章于 2021-02-23 13:34:08 发布

阅读量124

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_44000635/article/details/107404420

版权

前端专栏收录该内容

12 篇文章 0 订阅

订阅专栏

$("#form-login").serialize()

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
</head>
<body>
<h1>用户登录</h1>
<form id="form-login" method="post" action="login">
    <table cellpadding="5">
        <tr>
            <td>用户名</td>
            <td><input name="username"/><span style="color:red;" id="span-username"></span></td>
        </tr>
        <tr>
            <td>密码</td>
            <td><input name="password"/><span style="color:red;" id="span-password"></span></td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="button" onclick="login()" value="登录"/>
            </td>
        </tr>
    </table>
</form>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js"></script>
<script type="text/javascript">
    function login() {
        $("#span-username").empty();
        $("#span-password").empty();

        $.ajax({
            "url": "/pass",
            "data": $("#form-login").serialize(),
            "type": "post",
            "dataType": "json",
            "success": function (json) {
                if (json.state == 1) {
                    alert("登录成功！");
                } else if (json.state == 2) {
                    // alert("用户名不存在！");
                    $("#span-username").html("用户名不存在！");
                } else if (json.state == 3) {
                    // alert("密码错误！");
                    $("#span-password").html("密码错误！");
                }
            }
        });
    }
</script>
</body>
</html>

流浪者的短匕

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
表单提交

$("#form-login").serialize()<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>用户登录</title></head><body><h1>用户登录</h1><form id="form-login" method="post" action="logi..
复制链接

扫一扫

专栏目录