Maison > Article > interface Web > Comment implémenter le code de vérification frontale en js ? (code)

Comment implémenter le code de vérification frontale en js ? (code)

不言original: 2018-08-15 15:55:331891parcourir

Le contenu de cet article explique comment implémenter le code de vérification frontale en js ? (code), il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Les étudiants qui peuvent vérifier ce point de connaissances doivent avoir au moins maîtrisé un peu de connaissances JavaWeb. Ils doivent être capables de comprendre ce code et de savoir l'utiliser !

<body>
  <div class="input">
            &nbsp&nbsp<span 
style="font-size:16px;font-family: 
黑体">验证码:</span>&nbsp<input id="t1" type="text" name="u" 
 onblur="but()" />
                   <span id="discode"></span>
                   <input type="button" value="点击刷新" class="c" style="height:20px;"onClick="createCode()">
      </div>
<script language="javascript">
        var code; //在全局 定义验证码
        function createCode() { //创建验证码函数
            code = "";
            var codeLength = 4;//验证码的长度
            var selectChar = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, &#39;A&#39;, &#39;B&#39;,
                    &#39;C&#39;, &#39;D&#39;, &#39;E&#39;, &#39;F&#39;, &#39;G&#39;, &#39;H&#39;, &#39;I&#39;, &#39;J&#39;, &#39;K&#39;, &#39;L&#39;, &#39;M&#39;, &#39;N&#39;,
                    &#39;O&#39;, &#39;P&#39;, &#39;Q&#39;, &#39;R&#39;, &#39;S&#39;, &#39;T&#39;, &#39;U&#39;, &#39;V&#39;, &#39;W&#39;, &#39;X&#39;, &#39;Y&#39;, &#39;Z&#39;);//所有候选组成验证码的字符，当然也可以用中文的
            for (var i = 0; i < codeLength; i++) {
                var charIndex = Math.floor(Math.random() * 36);
                code += selectChar[charIndex];
            }
            // 设置验证码的显示样式，并显示
            document.getElementById("discode").style.fontFamily = "黑体"; //设置字体
            document.getElementById("discode").style.letterSpacing = "20px"; //字体间距
            document.getElementById("discode").style.color = "red"; //字体颜色
            document.getElementById("discode").innerHTML = code; // 显示
        }
        function but() {//验证验证码输入是否正确
            var val1 = document.getElementById("t1").value;
            var val2 = code;
            if (val1 != val2) {
                
                document.getElementById(&#39;t1&#39;).value = "";
            }
        }
    </script>
</body>

Recommandations associées :

collecte de vérification des données js, vérification des e-mails js, vérification de l'URL js, vérification de la longueur js, vérification numérique js et autres effets simples de packages_form

JS Common Verification REG

Recherche d'un code js permettant de vérifier le numéro de téléphone portable saisi par le utilisateur, Et transmettre le code d'arrière-plan

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

封装 JS

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Une introduction à l'analyse des objets prototypes js et des chaînes de prototypes (avec code)Article suivant：Une introduction à l'analyse des objets prototypes js et des chaînes de prototypes (avec code)

Articles Liés

Voir plus