jQuery中登录友好提示系列（1）

最新推荐文章于 2021-06-10 00:10:53 发布

原创最新推荐文章于 2021-06-10 00:10:53 发布 · 394 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery

jQuery 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一个简单的HTML表单，并使用jQuery实现表单输入验证的功能。当用户名字段失去焦点时，若为空则显示提示信息并阻止表单提交。

先看html代码

<form action="" method="post" id="my" >

用户名：<input type="text" name="name1" id="user"/><span class="tip" style="display:none">用户名不能为空</span><br/>
密码：<input type="password" name="name2" id="pwd"/><br/>
<input type="submit" value="提交"/>

</form>

自然，在写jQuery代码时，可以考虑blur的情况进行处理

$(function(){
    $("#user").blur(function(){
        return check();
    });

});

    function check(){
    var user=$("#user").val();
            if(user==""){
            $(".tip").show().css("color","red");
            //alert("dsdds");
            return false;
        }
    }