모바일 장치에서 그림 잠금 해제를 구현하는 순수 JavaScript 코드_javascript 기술

WBOY
풀어 주다: 2016-05-16 15:36:27
원래의
1827명이 탐색했습니다.

휴대폰 기기에는 누구나 익숙할 화면 잠금 해제 애플리케이션이 있습니다. 모바일 기기에서는 사용자가 잠금 패턴을 비밀번호로 설정하여 기기 사용자 인터페이스를 잠글 수 있습니다. 아래에.

렌더링은 아래와 같습니다


자바스크립트 코드

<script> 
 $("#gesturepwd").GesturePasswd({ 
backgroundColor:"#2980B9", //背景色 
color:"#FFFFFF",  //主要的控件颜色 
roundRadii:50,  //大圆点的半径 
pointRadii:12, //大圆点被选中时显示的圆心的半径 
space:60, //大圆点之间的间隙 
width:480,  //整个组件的宽度 
height:480, //整个组件的高度 
lineColor:"#ECF0F1",  //用户划出线条的颜色 
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("Pattern is correct") 
   },500); //延迟半秒以照顾视觉效果 
  } 
  else{ 
   $("#gesturepwd").trigger("passwdWrong"); 
   //密码验证错误后的其他操作。。。 
  } 
 }); 
</script> 
로그인 후 복사

위 코드도 매우 간단합니다. 순수 js 코드는 모바일 장치에서 그림 잠금 해제를 구현합니다. 물론 이것은 친구들이 각자의 필요에 따라 사용해야 하는 핵심 코드입니다. 이 글을 공유하는 것이 모든 사람에게 도움이 되기를 바랍니다.

관련 라벨:
js
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!