编程 Javascript

JavaScript登录验证码的实现

Posted in Javascript onOctober 27, 2016

废话不多说，实现js登录验证码的功能需要下面两步，具体实现过程如下所示：

1.js

var code="" ; //在全局 定义验证码
function createCode(){ 
code = "";
var codeLength = 6;//验证码的长度
var checkCode = document.getElementById("checkCode");
checkCode.value = "";
var selectChar = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','J','K','L','M','N','P','Q','R','S','T','U','V','W','X','Y','Z');
for(var i=0;i<codeLength;i++) {
var charIndex = Math.floor(Math.random()*32);
code +=selectChar[charIndex];
}
if(code.length != codeLength){
createCode();
}
document.getElementById("checkCode").innerHTML = code;
}
function validate () {
var inputCode = document.getElementById("checkNum").value.toUpperCase();
if(inputCode.length <=0) {
alert("请输入验证码！");
return false;
}
else if(inputCode != code ){
alert("验证码输入错误！");
createCode();
return false;
}
else {
alert("验证码通过！");
return true;
}
}

2.html

<body onload="createCode();">
<input type="text" value="" id="checkNum" />
<a id="checkCode" onclick="createCode()"></a>
<input type="button" class="btnCheck" id="gotoCheck" value="验证" onclick="validate();" />

以上所述是小编给大家介绍的JavaScript登录验证码的实现，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持！

JavaScript登录验证码的实现

- Author -

非非是

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

解决jQuery插件tipswindown与hintbox冲突

Nov 05 Javascript

浅析jquery的js图表组件highcharts

Mar 06 Javascript

用于deeplink的js方法(判断手机是否安装app)

Apr 02 Javascript

javascript实现的HashMap类代码

Jun 27 Javascript

JavaScript生成随机数的4种自定义函数分享

Feb 28 Javascript

jquery带下拉菜单和焦点图代码分享

Aug 24 Javascript

尝试动手制作javascript放大镜效果

Dec 25 Javascript

详解Bootstrap glyphicons字体图标

Jan 04 Javascript

js实现简单排列组合的方法

Jan 27 Javascript

JS/jQuery实现获取时间的方法及常用类完整示例

Mar 07 jQuery

Vue3.0 响应式系统源码逐行分析讲解

Oct 14 Javascript

微信小程序自定义胶囊样式

Dec 27 Javascript

微信小程序自定义创建详细介绍

Oct 27 #Javascript

vue中渐进过渡效果实现

Oct 27 #Javascript

基于JS实现横线提示输入验证码随验证码输入消失(js验证码的实现)

Oct 27 #Javascript

真正好用的js验证上传文件大小的简单方法

Oct 27 #Javascript

vue的props实现子组件随父组件一起变化

Oct 27 #Javascript

用js控件div的滚动条,让它在内容更新时自动滚到底部的实现方法

Oct 27 #Javascript

简单理解vue中Props属性

Oct 27 #Javascript