`
sanyecao2314
  • 浏览: 135165 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

简单的前台验证码.

阅读更多

项目里用到的不要和后台交互的简单验证码.标记一下.

<html>
<head>
<style type="text/css">
.code{
background-image:url(111.jpg);
font-family:Arial,宋体;
font-style:italic;
color:green;
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 = new Array();
var codeLength = 4;//验证码的长度
var checkCode = document.getElementById("checkCode");
checkCode.value = "";

var selectChar = new Array(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();
}
checkCode.value = code;
}

function validate () {
var inputCode = document.getElementById("input1").value.toUpperCase();

if(inputCode.length <=0) {
   alert("请输入验证码!");
   return false;
}
else if(inputCode != code ){
   alert("验证码输入错误!");
   createCode();
   return false;
}
else {
   alert("成功!");
   return true;
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head>
<body onLoad="createCode();">

<input type="text" id="input1" />
<input type="button" id="checkCode" class="code" style="width:60px" onClick="createCode()" /> <a href="#" onClick="createCode()"></a>
<input id="Button1" onClick="validate();" type="button" value="确定" />
<script></script>
</body>
</html>

 

分享到:
评论

相关推荐

    JS实现获取短信验证码功能(前台代码)

    这里我们可以简单模拟一个延迟发送的效果: ```javascript function sendSms(phoneNumber) { if (validatePhoneNumber(phoneNumber)) { // 模拟发送验证码,实际项目中应替换为调用后端API setTimeout...

    c#生成图片验证码代码

    1. **安全性增强**:除了简单的随机线条外,还可以增加扭曲效果、阴影、背景图案等来提高破解难度。 2. **用户体验优化**:提供验证码刷新功能、支持语音读出等。 3. **适应性设计**:确保验证码在不同设备和屏幕...

    ThinkPHP6.0.5框架多应用模式简单测试(验证码扩展+视图扩展)

    该ThinkPHP版本主要是简单测试了TP的多应用模式 代码分了前后台目录 后台是admin 前台是index,并可通过 模型/控制器/方法 来访问。集成了验证码扩展+视图扩展,当然多应用模式也在其中已集成好。

    java实现汉字验证码

    今天整理了一个java实现的汉字输入验证码 主要包含两个类,一个是生成...实现原理非常简单,将汉字和干扰线生成图片并将汉字保存到session,前台获取每次生成验证码图片并用文本框值和session值比较,功能就这么简单。

    Java汉字随机验证码

    主要包含两个类,一个是...实现原理比较简单,将汉字和干扰线生成图片并将汉字保存到session,前台获取每次生成的验证码图片进行展示,验证的时候就获取文本框输入的值传到后台与session值进行比较,功能就怎么简单。

    校园教育网站管理系统源码

    采用Asp+Access开发的,简单易管理,适用刚学网站或中小企业,可对新闻、文章、供求、特效、图片、音乐、动画、软件等栏目进行添加、管理操作 ...把admin888改成你要的验证码.asp不动 后台生成页面需要购买正版

    Happy Captcha简易验证码源代码

    Happy Captcha简易验证码是一款易于使用的Java验证码软件包,旨在花最短的时间,最少的代码量,实现Web站点的验证码功能。 Happy Captcha简易验证码提供了图片和动画两种展现形式,验证码内容包括中文(收录3500个...

    shopex模板修改简易手册和ecshop二次开发文档

    ┣ auction.php 拍卖前台文件 ┣ brand.php 品牌列表 ┣ captcha.php 生成验证码 ┣ catalog.php 列出所以分类及品牌 ┣ category.php 商品分类 ┣ comment.php 提交用户评论 ┣ compare.php 商品比较程序 ┣ cycle_...

    jsp+ajax实现的局部刷新较验验证码(onblur事件触发较验).docx

    这里定义了一个简单的表单,其中包含一个文本输入框用于输入验证码、一个用于显示验证结果的`&lt;span&gt;`元素以及一个用于显示验证码图像的`&lt;img&gt;`标签。 #### 2. JavaScript代码实现 ```javascript function ...

    一个简单的PHP验证码实现代码

    在PHP中实现一个简单的验证码并不复杂,通过以下几个关键步骤,我们可以创建一个既实用又美观的验证码系统。 首先,我们需要生成一个随机的四位数字验证码。这可以通过循环和`mt_rand()`函数来实现。`mt_rand()`是...

    一个简单的前台弹框登录,可自行修改

    在这个“一个简单的前台弹框登录”示例中,我们将探讨实现这一功能的关键知识点。 首先,弹框(Modal)是用户界面中的一种常见元素,它会在页面的主内容之上显示一个浮动的窗口,通常用于显示警告、确认操作或者像...

    asp.net简单生成验证码的方法

    ***简单生成验证码的方法主要涉及以下几个知识点: 1. 验证码的基本概念和作用 验证码是一种区分用户是计算机还是人的公共全自动程序。可以防止恶意破解密码、刷票、论坛灌水等行为,有效保护网站或应用的安全。在...

    校园教育网站管理系统.rar

    采用Asp Access开发的,简单易管理,适用刚学网站或中小企业,可对新闻、文章、供求、特效、图片、音乐、动画、软件等栏目进行添加、管理操作 ...把admin888改成你要的验证码.asp不动 后台生成页面需要购买正版

    KingCMS v6.1 正式版 SP2

    KingCMS拥有简单灵活的多级模板标签、高效的模板解析引擎、可以生成HTML或伪静态、任意扩展的功能模型、定制管理界面、支持SQLite、挂接数据源、内外模板分离模式等众多新颖的功能。  KingCMS v6.1 SP2更新记录: ...

    Strut2版使用kaptcha验证码

    kaptcha验证码在使用上比其它的都方便,配置也相对简单,建议将本实例中的源码导入到Eclipse运行。其中主要有几处配置,一是在Web.xml文件里增加相应的配置,后是在Action里做相关的生成及校验工作。前台采用不刷新...

    java实现验证码类生成中文验证码

    java实现的汉字输入验证码,主要包含两个类,一个是生成验证码,一个是判断验证码输入是否正确,实现原理非常简单,将汉字和干扰线生成图片并将汉字保存到session,前台获取每次生成验证码图片并用文本框值和session值...

    用户登录前台模板 a

    8. **验证码**:为了防止自动化的恶意登录尝试,许多登录模板会包含验证码,要求用户输入图片上的文字或完成其他简单的验证任务。 9. **多语言支持**:对于面向全球用户的网站,登录模板可能需要提供多语言支持,让...

    ThinkPHP5&5.1实现验证码的生成、使用及点击刷新功能示例

    验证码现在是用户登录、支付等很多环节的必备元素,ThinkPHP5&5.1给我们提供了验证码的生成方式,也是非常的简单,在这里写一个完整的验证码验证的使用方法,供大家参考。 前台用户在登录时候需要验证码验证才能登录...

    Yii 2.0自带的验证码使用经验分享

    Yii 2.0 框架自带了验证码组件,使得集成验证码变得更加简单。 首先,从Yii 2.0 的结构上看,它采用模块化的设计理念。在使用验证码功能之前,需要在应用的适当位置添加相应的代码。在官方的文档中,通常会有一个名...

    手势解锁_企业城微信小程序js代码前台前端H5页面源码.rar

    10. **用户体验优化**:手势解锁的设计应尽量简单易用,同时避免过于简单的手势导致安全性降低。可以通过设置手势长度、转弯次数等要求来平衡这两者。 这个"手势解锁_企业城微信小程序js代码前台前端H5页面源码"的...

Global site tag (gtag.js) - Google Analytics