如何使用jquery进行表单验证

最新推荐文章于 2024-01-16 11:20:16 发布

qq_37858942

最新推荐文章于 2024-01-16 11:20:16 发布

阅读量316

点赞数

文章标签： html jquery

本文链接：https://blog.csdn.net/qq_37858942/article/details/97813927

版权

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script type="text/javascript" src="./js/jquery.js"></script>
    <script>
        $(document).ready(function(){
            $("#name").blur(function(){
                var a=$("#name").val();
                if(a==''){
                    //当输入的数据为空时通过div提示输入不能为空
                    //也可以进行其他判断，自行发挥
                    $("#showMsg").append("<p>输入不能为空</p>")
                }
                else{
                    //当输入的数据不为空而曾经输入过空数据时 使div清空
                    $("#showMsg").empty()
                }
            })
            $("#name").focus(function(){
                //当再次输入时去掉div提示的文字
                //解决当连续输入空值时div增加提示的情况
                $("#showMsg").empty()
            })
        })
    </script>
</head>
<body>
    企业名称：<input type="text" id="name"><br>
    <div id="showMsg" class="show"></div>
    企业法人：<input type="text" id="faren">
</body>
<style>
    .show{
        color: red;
        font-size: large
    }
</style>
</html>

当使用javascript时可以使用innerHTML=" 要提示的话" 效果在现阶段和append相同
虽然jQuery在选择DOM节点时非常便利但是在向节点中添加数据时感觉并不如js方便
jQuery的empty()方法存在弊端，在使用jQuery对节点进行文本的增加或删除时需要谨慎

qq_37858942

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
如何使用jquery进行表单验证

<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content=...
复制链接

扫一扫