`
ykyfendou
  • 浏览: 407978 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JS验证码(不区分大小写)

阅读更多

 

HTML代码:

 

<body onLoad="createCode()">

<!-- 

整个html打开可以看到效果,不包含验证码背景图片,自己找一个命名为code.jpg就有背景了,
js验证码比jsp验证码好处在于:对于一个注册或者登陆页面,如果想通过点击提交按钮触发js事件,
那么jsp用的是(String)session.getAttribute("rand");那么对于刷新图片后,session不能立刻保存为新值,
验证就永远不能通过,反之js用的是一个全局变量不需要session

这个程序既可以直接验证,也可以点击验证码刷新一个新的验证码(当原来的验证码看不清楚的时候),再验证


 -->


<style type="text/css">  
        .code   
        {   
            background-image:url(code.jpg);   
            font-family:Arial;   
            font-style:italic;   
            color:Red;   
            border:0;   
            padding:2px 3px;   
            letter-spacing:3px;   
            font-weight:bolder;   
        }   
        .unchanged   
        {   
            border:0;   
        }   
    </style>  
    <script language="javascript" type="text/javascript">  
       
     var code ; //在全局 定义验证码   
     function createCode()   
     {    
       code = "";   
       var codeLength = 6;//验证码的长度   
       var checkCode = document.getElementById("checkCode");   
       var selectChar = 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');//所有候选组成验证码的字符,当然也可以用中文的      
       for(var i=0;i<codeLength;i++)   
       {   
        var charIndex = Math.floor(Math.random()*36);   
        code +=selectChar[charIndex];   
       }    
       if(checkCode)   
       {   
         checkCode.className="code";   
         checkCode.value = code;
         checkCode.blur();   
       }        
     }     
     function validate ()   {   
       var inputCode = document.getElementById("validCode").value;   
       if(inputCode.length <=0)   
       {   
           alert("请输入验证码!");   
       }   
       else if(inputCode.toUpperCase() != code )   
       {   
          alert("验证码输入错误!");   
          createCode();//刷新验证码   
       }   
       else   
       {   
         alert("^-^ OK");   
       }   
 }   
       
    </script>  
    <form  action="#">  
     <input  type="text"   id="validCode" />  
    <input type="text" onClick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px;cursor:pointer"  /><br />  
    <input id="Button1"  onclick="validate();" type="button" value="确定" />    
</form>

 

分享到:
评论

相关推荐

    asp.net验证码 不区分大小写

    本文将深入探讨如何在ASP.NET环境中创建一个不区分大小写的验证码功能。 首先,验证码的核心在于生成一组随机字符序列,这可以通过`Random`类和字符串的`Substring`方法来实现。创建一个指定长度(例如4到6位)的...

    jQuery区分大小写验证码输入框.zip

    "jQuery区分大小写验证码输入框" 是一个专为提高用户体验而设计的JavaScript插件,它使得验证码输入更加直观且有效。这款插件主要应用于前端交互,尤其在用户注册、登录、评论等需要验证用户身份的场景。 jQuery是...

    【JavaScript源代码】JavaScript实现随机生成验证码及校验.docx

     本文实例为大家分享了JavaScript实现随机生成验证码及校验的具体代码,供大家参考,具体内容如下 输入验证码(区分大小写)点击确认,进行校验。出错就弹框提示 点击 看不清 重新随机生成验证码 当验证码输入...

    JS实现4位随机验证码

    通过随机数编写一个不分大小写且含数字的4位随机数。 CSS样式 p{ width: 60px; height: 20px; display: inline-block; letter-spacing: 3px; border: 1px solid red; } #div{ height: 20px; margin-bottom: ...

    jQuery区分大小写验证码输入框特效代码

    jQuery区分大小写验证码输入框特效代码是为提高验证码验证的用户体验而设计的一种插件。这个插件允许开发者创建一个具有特定功能的输入框,用户在其中输入验证码时,系统会检查字符的大小写是否匹配,从而增强了验证...

    JS实现数字字母混合验证码(数字+大写字母+小写字母)

    在JavaScript中实现数字字母混合验证码是一项常见的安全措施,用于验证用户身份或防止自动化脚本的攻击。本示例中,我们将探讨如何通过JavaScript生成包含数字、大写字母和小写字母的随机验证码。 首先,我们需要...

    jQuery验证码输入框代码.zip

    这个jQuery插件提供了一个输入区分大小写的验证码功能,这意味着用户必须正确地输入特定的字符序列,同时尊重字符的大小写格式。这样的设计增加了验证码的安全性,因为机器往往难以区分大小写字母。此外,插件被描述...

    4个英文字母的验证码

    3. **大小写不区分**:为了不区分大小写,我们可以将所有字母转换为大写或小写。在这里,我们将其转换为小写,因为ASCII值的顺序不会因大小写而改变。 ```python def make_case_insensitive(code): return code....

    JS验证码

    `),并将其转换为大写,以忽略大小写差异。 - 验证用户输入是否为空,若为空则弹出警告并返回 `false`。 - 比较用户输入与生成的验证码是否一致,如果不一致则提示错误,重新生成验证码,并返回 `false`。 - 若...

    数字+字母验证码

    这些随机数可以是整数或浮点数,但根据描述,这里可能是选择0到9的数字和26个字母(可能区分大小写)的组合。随机性是确保验证码难以预测的关键因素。 2. **数字与字母的转换**:随机数被映射为对应的数字或字母。...

    layui实现登陆界面验证码.docx

    请输入验证码(不区分大小写)" class="input-val"&gt; &lt;canvas id="canvas" width="100" height="30"&gt;&lt;/canvas&gt; 登录" class="layui-btn layui-btn-fluid" lay-submit lay-filter="login"&gt; ``` 在上面的...

    防机器人验证码

    这可能涉及到扭曲的字符、噪声背景、混合大小写字母、数字以及有时甚至符号的使用。 3. **可读性**:虽然复杂性很重要,但验证码还需要保持一定程度的人工可读性,以免给正常用户带来困扰。本项目中提到的验证码...

    基于Java+Bootstrap+HTML+CSS+JavaScript的上机考试管理系统.zip

    验证码不区分大小写 页面设计合理 双层MD5加密 过滤器权限保护 MVC+DAO工厂模式,易维护易拓展便于开发 代码结构符合开发规范 功能丰富 支持xlsx表格文件导入名单 学生个人云空间 搜索部分均支持模糊查询 开发环境 ...

    asp.net非常酷的验证码 [不同字体,不同颜色]

    调用方法如下: 不区分大小写" alt="不区分大小写" onclick='javascript:this.src="../ValidateCode.aspx?ro=" + Math.random();' style="cursor:pointer; width: 84px;"/&gt;

    JS 验证码功能的三种实现方式

    请输入验证码(不区分大小写)"&gt; &lt;canvas id="canvas" width="100" height="30"&gt;&lt;/canvas&gt; 提交 const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); // 生成随机颜色 ...

    java验证码配置

    - 使用复杂的字符组合(数字+字母),并且可以混合大小写。 - 加入随机线条、点等干扰元素,增加破解难度。 - 使用更复杂的图像处理技术,如扭曲、模糊等效果。 - 对于高安全性的应用,可以考虑使用图形验证码或...

    JavaScript 随机验证码的生成实例代码

    字符集包括了大小写字母,这使得生成的验证码支持大小写混合。 在循环结束后,如果页面上有一个用于显示验证码的`checkCode`元素,那么就将其值设置为生成的验证码字符串。这样做可以在页面上显示出生成的验证码。 ...

    diy_wish.rar_PHP许愿墙留言 许愿墙

    在新版本中,验证码已经修改为不区分大小写,这可能会使用户体验更友好,因为用户不再需要担心输入的验证码字母大小写是否正确。 在验证码不区分大小写的设置下,虽然可能降低了对自动攻击的一些防护,但考虑到许愿...

Global site tag (gtag.js) - Google Analytics