JavaScript实现验证码码登录验证_验证码正确才能按钮 asp js-程序员宅基地

废话不多少，直接贴代码，逻辑简单，多动手

<html>
<head>
<title>js验证码</title>
<style type="text/css">
.code 
{
 background:url(code_bg.jpg);
 font-family:Arial;
 font-style:italic;
 color:blue;
 font-size:30px;
 border:0;
 padding:2px 3px;
 letter-spacing:3px;
 font-weight:bolder;
 float:left;
 cursor:pointer;
 width:150px;
 height:60px;
 line-height:60px;
 text-align:center;
 vertical-align:middle;
}
a 
{
 text-decoration:none;
 font-size:12px;
 color:#288bc4;
}
a:hover 
{
 text-decoration:underline;
}
</style>
<script type="text/javascript">
var code;
function createCode() 
{
 code = "";
 var codeLength = 6; //验证码的长度
 var checkCode = document.getElementById("checkCode");
 var codeChars = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 
      'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z',
      'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'); //所有候选组成验证码的字符，当然也可以用中文的
 for(var i = 0; i < codeLength; i++) 
 {
  var charNum = Math.floor(Math.random() * 52);
  code += codeChars[charNum];
 }
 if(checkCode) 
 {
  checkCode.className = "code";
  checkCode.innerHTML = code;
 }
}
function validateCode() 
{
 var inputCode=document.getElementById("inputCode").value;
 if(inputCode.length <= 0) 
 {
  alert("请输入验证码！");
 }
 else if(inputCode.toUpperCase() != code.toUpperCase()) 
 {
   alert("验证码输入有误！");
   createCode();
 }
 else 
 {
  alert("验证码正确！");
 }    
}  
</script>
</head>
<body οnlοad="createCode()">
<form id="form1" runat="server" οnsubmit="validateCode()">
 <div>
  <table border="0" cellspacing="5" cellpadding="5" >
   <tr>
    <td></td>
    <td><div class="code" id="checkCode" οnclick="createCode()" ></div></td>
    <td><a href="#" οnclick="createCode()">看不清换一张</a></td>
   </tr>
   <tr>
    <td>验证码：</td>
    <td><input style="float:left;" type="text"  id="inputCode" /></td>
    <td>请输入验证码</td>
   </tr>
   <tr>
    <td></td>
    <td><input id="Button1" οnclick="validateCode();" type="button" value="确定" /></td>
    <td></td>
   </tr>
  </table>
 </div>
</form>
</body>
</html>

本文链接：https://blog.csdn.net/SooZooKi/article/details/78904998

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

Golang | Leetcode Golang题解之第36题有效的数独-程序员宅基地

文章浏览阅读520次。Golang | Leetcode Golang题解之第36题有效的数独

稍微深入分析Ubuntu环境下安装NVIDIA驱动导致黑屏的原因_prime-select nvidia 黑屏-程序员宅基地

文章浏览阅读8.2k次，点赞5次，收藏48次。本文承接之前写的有关如何用正确姿势安装NVIDIA驱动的博文（https://blog.csdn.net/Edward_ed_liu/article/details/109552761）。首先之所以要更新Linux内核，是因为不更新内核就无法使用笔记本自带的无线网卡。其次，目前NVIDIA官方不建议把Linux内核更新到最新版（5.9），而且这条消息只在英文的官网才有，中文的则是广告。TWICE如果强行更新到5.9版本，之后的Cuda安装表面上会显示成功，但在实际使用Cuda的过程中._prime-select nvidia 黑屏

java中间件有哪些_金九银十期间成功斩获58万架构师Offer！六面字节跳动面经和面试题分享 - 小梦爱Java...-程序员宅基地

文章浏览阅读167次。金九银十期间成功斩获58万Offer！六面字节跳动面经(成功关键：吃透九大核心知识+狂刷大厂面试真题)第一轮：团队面试第一轮基本上是你的团队成员面试你，是和你同级或者高你一个P的师兄来面你，我的话基本没问什么特别的，主要还是讲自己简历上的做的项目，这里需要你很熟悉自己的项目才行，我个人觉得这里你要把项目里你的角色做了什么没做什么讲清楚，然后最好能把自己做的那部分重点展开来讲，然后面试官会从你讲的内..._java架构师中间件简历

【规则引擎】一、规则引擎简介_规则引擎风险功能-程序员宅基地

文章浏览阅读1.9k次。(第一章规则引擎学习入门之规则引擎简介)# 系列文章目录规则引擎简介前言一、为什么要使用规则引擎？1.不使用规则引擎的规则执行现状2. 规则引擎优点二、规则引擎的功能三、规则引擎的分类实现1.事中规则实现2.事后规则实现四、规则引擎调研1.开源规则引擎2.商业规则引擎五、Drools六、Aviator前言规则引擎由推理引擎发展而来，是一种嵌入在应用程序中的组件，实现了将业务决策从应用程序代码中分离出来，并使用预定义的语义模块编写业务决策。接受数据输入，解释业务规则，并根据业务规则做出业务决策。–来自百_规则引擎风险功能

oracle设置生成归档日志大小,Oracle 改变归档日志大小-程序员宅基地

文章浏览阅读1k次。该变归档日志大小只有改变日志组的大小！方法：加入新的大的日志文件，然后删掉旧的小的日志文件假设现有三个日志组，每个组内有一个成员，每个成员的大小为1MB，现在想把此三个日志组的成员大小都改为10MB1、创建2个新的日志组alter database add logfile group 4 ('D:\ORACLE\ORADATA\ORADB\REDO04_1.LOG') size 1024k;alt..._oracle归档日志空间大小

this.options在chrome浏览器提示undefined的解决办法_options is undefined-程序员宅基地

文章浏览阅读7.5k次。很早用的一段三级联动下拉菜单最近发现在chrome里不能联动下拉了，ie下正常，很奇怪，这段代码在之前有段时间经常用，没出现过什么问题，后来调试发现在“this.options.value”处提示“this.options is unfioned”,应该是浏览器之间js用法不同的问题，查资料测试后，改成“this.value”就正常了_options is undefined

随便推点

美团2024届秋招笔试第一场编程真题——小美的好矩阵-程序员宅基地

文章浏览阅读1.3k次。现在给定一个n∗m的矩阵，小美想知道有多少个3*3的子矩阵是好矩阵，你能帮帮她吗？接下来的n行，每行输入一个仅包含大写字母的长度为m的字符串。第一行输入两个整数n,m，代表矩阵的行数和列数。左下角的存在两个相邻的字母相同，因此不合法。左上角的子矩阵出现了’D’，因此不合法。右下角的子矩阵里没有’C’，因此不合法。解法：纯模拟，被恶心到了。输出一个整数表示答案。有4个3*3的子矩阵。_小美的好矩阵

Vector - CANoe - LIN一致性测试_vector canoe-程序员宅基地

文章浏览阅读2.5k次，点赞6次，收藏40次。CANoe一键生成LIN一致性测试_vector canoe

当下 React 项目该放弃的以及更好用的技术推荐-程序员宅基地

文章浏览阅读210次。React 版本推荐当前 React 都已经发布 18 了，虽然是个 alpha 版本，但是 17 确实也已经有大厂在用了。目前如果你的版本还停留在 v16.8 之前的话还是尽早升了吧。毕..._react 放弃

C++基础-资源管理：堆、栈与 RAII_c++heap内存堆管理-程序员宅基地

文章浏览阅读161次。堆，英文是 heap，在内存管理的语境下，指的是动态内存分配的区域，和数据结构中的“大根堆和小根堆”不是一个概念。同时，这里堆分配的内存需要手工释放，否则会造成内存泄漏。 C++ 标准里有一个和堆相关的概念是自由存储区，英文是 free store，特指使用 new 和 delete 来分配和释放内存的区域。一般而言，这是堆的一个子集。_c++heap内存堆管理

CentOS7中安装MySQL8.0.21爬坑记录:1045-Access denied、Job for firewalld.service failed等异常_error: failed to read file "/proc/sys/net/netfilte-程序员宅基地

文章浏览阅读1.3k次。在CentOS7.3中安装了MySQL8.0.21之后，就开启了一段漫长的爬坑历程，简要回顾如下：一、从Win10中用Navicat连接安装好的MySQL服务器出现如下异常：1045 - Access denied for user ‘root’@‘192.168.101.151’(using password: YES) 于是，在网上查阅了多篇博客，结论可能是3306端口没有加入到防火墙的允许列表。之后，开始研究了CentOS7中的防火墙，发现RHEL6之前版本用的防火墙管理工具都是iptab_error: failed to read file "/proc/sys/net/netfilter/nf_conntrack_helper": [e

Java位运算技巧_java巧用位运算记录用户-程序员宅基地

文章浏览阅读3.2k次，点赞6次，收藏16次。位运算作为底层的基本运算操作，往往是和'高效'二字沾边，适当的运用位运算来优化系统的核心代码，会让你的代码变得十分的精妙。以下是我所遇之的一些简单的位运算技巧作为博文记录。1.获得int型最大值 public static void main(String[] args) { int maxInt = (1 << 31) - 1; ..._java巧用位运算记录用户