zoukankan      html  css  js  c++  java
  • 表单验证

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
            <style>
            .error{
                color: red;
            }
        </style>
    </head>
    <body>
        <form id="f1"  action="T12.html" method="post">
            <div><input name="a1" type="text"/></div>
            <div><input name="a2" type="password"/></div>
            <div><input name="a3" type="text"/></div>
            <div><input name="a4" type="text"/></div>
            <div><input name="a5" type="text"/></div>
    
            <input type="submit" value="提交"/>
        </form>
        <script src="jquery.js"></script>
        <script>
            $(':submit').click(function () {
                var flag = true;
                $('.error').remove();
    
                $('#f1').find('input[type="text"],input[type="password"]').each(function () {
                    var v = $(this).val();
                    // var n = $(this).attr('tex');
                    if(v.length <=0){
                        flag = false;
                        var tag = document.createElement('span');
                        tag.className="error";
    
                        tag.innerHTML='必填';
                        $(this).after(tag);
                    }
                });
                return flag;
    
            })
            // $(':submit').click(function () {
            //     var v = $(this).prev().val();
            //     if(v.length >0){
            //         return true
            //     }else {
            //         alert('请输入内容')
            //         return false
            //
            //     }
            // })
        </script>
    
    </body>
    </html>

     注释:

    #当页面框架加载完成之后,自动执行
                    $(function){
                        $(...)
                    }
       

  • 相关阅读:
    win10 visual studio 2017环境中安装CUDA8
    UEFI+GPT电脑Win10下安装openSUSE Leap 42.2双系统
    CentOS7安装PPTP
    Python基础-三元运算
    Python基础-字典dict
    Python基础-元组tuple
    Python基础-列表list
    Python基础-str类型
    Python基础-int类型方法
    Python基础-查看对象的类或对象所具备的功能
  • 原文地址:https://www.cnblogs.com/anhao-world/p/14464497.html
Copyright © 2011-2022 走看看