recherche

Maison >interface Web >js tutoriel >Explication détaillée du plug-in de mot de passe de geste jquery

Explication détaillée du plug-in de mot de passe de geste jquery

小云云
小云云original
2018-01-22 13:09:151584parcourir

Le mot de passe gestuel est également une fonction très populaire maintenant. Cet article présente principalement les connaissances pertinentes du plug-in de mot de passe gestuel jquery, qui a une bonne valeur de référence. Jetons-y un coup d'œil avec l'éditeur. tout le monde.

Rendu :

Le code est le suivant : 


<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title></title>
 <!--<link rel="stylesheet" href="../dist/css/danmuplayer.css" rel="external nofollow" >-->
</head>
<body>
正确的密码是一个字母“Z”的形状哦！
<p id="gesturepwd"></p>
</body>
<script src="http://www.jq22.com/demo/jQueryGesturePassword20161102/jquery-2.1.4.min.js"></script>
<script src="http://www.jq22.com/demo/jQueryGesturePassword20161102/src/jquery.gesture.password.js"></script>
<!--<script src="../dist/js/danmuplayer.min.js"></script>-->
<script>
 $("#gesturepwd").GesturePasswd({
backgroundColor:"#252736", //背景色
color:"#FFFFFF", //主要的控件颜色
roundRadii:25, //大圆点的半径
pointRadii:6, //大圆点被选中时显示的圆心的半径
space:30, //大圆点之间的间隙
width:240, //整个组件的宽度
height:240, //整个组件的高度
lineColor:"#00aec7", //用户划出线条的颜色
zindex :100 //整个组件的css z-index属性
});
 $("#gesturepwd").on("hasPasswd",function(e,passwd){
 var result;
 if(passwd == "1235789"){
 result=true;
 }
 else {
 result=false;
 }
 if(result == true){
 $("#gesturepwd").trigger("passwdRight");
 setTimeout(function(){

 //密码验证正确后的其他操作，打开新的页面等。。。
 alert("密码正确！")
 },500); //延迟半秒以照顾视觉效果
 }
 else{
 $("#gesturepwd").trigger("passwdWrong");
 //密码验证错误后的其他操作。。。
 }
 });
</script>
</html>

Recommandations associées :

Exemple de fonction de vérification de la force du mot de passe JS basé sur les compétences en expressions régulières_javascript

Utilisation Comment utiliser javascript pour générer aléatoirement un certain nombre de mots de passe

Explication détaillée de l'exemple de confirmation de mot de passe de validation de formulaire jQuery

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!

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：Exemple de partage de l'implémentation jQuery de la fonction de code de vérificationArticle suivant：Exemple de partage de l'implémentation jQuery de la fonction de code de vérification

Articles Liés

Voir plus