純JavaScript代碼實現行動裝置繪圖解鎖，javascript解鎖

純JavaScript代碼實現行動裝置繪圖解鎖，javascript解鎖

移動手機裝置上有一個螢幕解鎖的應用相信大家都不陌生，在行動裝置上，使用者可以通過設定鎖定圖案作為密碼對裝置使用者介面進行鎖定，鎖定介面如所示。

如下所示

JavaScript Code

<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代碼實現行動裝置繪圖解鎖，當然這是核心代碼，其他的還需要小夥伴們根據自己的需求自行發揮。希望本文分享能給大家協助。