欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

如何使用jQuery的validate.js表單驗(yàn)證插件

本篇文章為大家展示了如何使用jQuery的validate.js表單驗(yàn)證插件,代碼簡(jiǎn)明扼要并且容易理解,絕對(duì)能使你眼前一亮,通過(guò)這篇文章的詳細(xì)介紹希望你能有所收獲。

創(chuàng)新互聯(lián)建站服務(wù)項(xiàng)目包括淶水網(wǎng)站建設(shè)、淶水網(wǎng)站制作、淶水網(wǎng)頁(yè)制作以及淶水網(wǎng)絡(luò)營(yíng)銷(xiāo)策劃等。多年來(lái),我們專(zhuān)注于互聯(lián)網(wǎng)行業(yè),利用自身積累的技術(shù)優(yōu)勢(shì)、行業(yè)經(jīng)驗(yàn)、深度合作伙伴關(guān)系等,向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案,淶水網(wǎng)站推廣取得了明顯的社會(huì)效益與經(jīng)濟(jì)效益。目前,我們服務(wù)的客戶(hù)以成都為中心已經(jīng)輻射到淶水省份的部分城市,未來(lái)相信會(huì)繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶(hù)的支持與信任!

效果:

代碼:

<!DOCTYPE html>
<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>表單驗(yàn)證插件Validate</title>
    <script src="js/jquery-1.10.2.min.js"></script>
    <script src="js/jquery.validate.min.js"></script>
    <style>
        body {
            background-color: #000;
        }
        
        form {
            width: 361px;
            margin: 80px auto;
            padding: 50px;
            border: 2px solid #666;
            box-shadow: 0 0 5px rgba(255, 255, 255, 0.2);
            background-color: #999;
            border-radius: 10px;
            box-sizing: border-box;
        }
        
        form>p {
            margin-bottom: 20px;
            color: #fff;
        }
        
        form>p>label {
            display: inline-block;
            width: 80px;
            text-align: center;
        }
        
        label.error {
            display: block;
            width: 100%;
            color: rgb(189, 42, 42);
            font-size: 12px;
            text-align: right;
            margin-top: 5px;
        }
        
        input {
            width: 170px;
            height: 20px;
            outline: none;
            background-color: #ddd;
            border: 1px solid #ddd;
            border-radius: 4px;
        }
        
        .submit {
            width: 170px;
            margin: 30px auto 0;
        }
        
        .submit input {
            background-color: #0099aa;
            color: #fff;
            border: 0;
            padding: 5px;
            height: 30px;
        }
    </style>
</head>

<body>
    <form id="signupForm" action="" method="post">
        <p>
            <label for="name">姓名:</label>
            <input type="text" id="name" name="name">
        </p>
        <p>
            <label for="email">郵箱:</label>
            <input type="email" id="email" name="email">
        </p>
        <p>
            <label for="password">密碼:</label>
            <input type="password" id="password" name="password">
        </p>
        <p>
            <label for="confirm_password">確認(rèn)密碼:</label>
            <input type="password" id="confirm_password" name="confirm_password">
        </p>
        <p class="submit">
            <input type="submit" value="提交">
        </p>
    </form>
</body>
<script>
    $(function() {
        $("#signupForm").validate({
            rules: {
                name: "required",
                email: {
                    required: true,
                    email: true
                },
                password: {
                    required: true,
                    minlength: 5
                },
                confirm_password: {
                    required: true,
                    minlength: 5,
                    equalTo: "#password"
                }
            },
            messages: {
                name: "請(qǐng)輸入姓名",
                email: {
                    required: "請(qǐng)輸入Email地址",
                    email: "請(qǐng)輸入正確的Email地址"
                },
                password: {
                    required: "請(qǐng)輸入密碼",
                    minlength: "密碼不能小于5個(gè)字符"
                },
                confirm_password: {
                    required: "請(qǐng)輸入確認(rèn)密碼",
                    minlength: "確認(rèn)密碼不能小于5個(gè)字符",
                    equalTo: "兩次輸入的密碼不一致"
                }
            }
        });
    })
</script>

</html>

上述內(nèi)容就是如何使用jQuery的validate.js表單驗(yàn)證插件,你們學(xué)到知識(shí)或技能了嗎?如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網(wǎng)站題目:如何使用jQuery的validate.js表單驗(yàn)證插件
本文地址:http://chinadenli.net/article2/goihic.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供標(biāo)簽優(yōu)化App開(kāi)發(fā)網(wǎng)站設(shè)計(jì)建站公司靜態(tài)網(wǎng)站微信小程序

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

微信小程序開(kāi)發(fā)