PHP+javascript制作带提示的验证码源码分享


Posted in PHP onMay 28, 2014

html代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>简单验证码</title>
</head>
<script language="javascript" src="js/checked.js"></script>
<body>
<form id="register" name="register" method="post" >
<table align="center">
    <tr>
      <td ><div align="right">验证码:</div></td>
      <td ><input id="yzm" type="text" name="yzm" size="8" onBlur="javascript:chkyzm(form)" onMouseOver="this.style.backgroundColor='#ffffff'" onMouseOut="this.style.backgroundColor='#e8f4ff'"/></td><td>
        <input id="yzm2" type="hidden" value="" /></td>
      <td align="center" valign="middle"><script>yzm()</script></td>
      <td ><a href="javascript:code()" style="text-decoration:none">看不清</a></td>
      <td width="150"  align="center"><div id="yzm1"><font color="#999999">请输入验证码</font></div></td>
    </tr>  
</table> 
  </form>
</body>
</html>

JS代码:

function chkyzm(form){     //对验证码进行验证
 if(form.yzm.value==""){
  yzm1.innerHTML="<font color=#FF0000>×验证码不能为空</font>"; 
 }else if(form.yzm.value!=form.yzm2.value){
  yzm1.innerHTML="<font color=#FF0000>×验证码输入错误</font>";
 }else{
  yzm1.innerHTML="<font color=green>√验证码输入正确</font>";
 }
}
function yzm(){      //生成验证码
 var num1=Math.round(Math.random()*1000000);//随机小数放大
 var num=num1.toString().substr(0,4);//取4位整数
 var yzm2=document.getElementById("yzm2");
 document.write("<img name=codeimg src=yzm.php?num="+num+"'>");
 yzm2.value=num;
}
function code(){      //重置验证码
 var num1=Math.round(Math.random()*1000000);
 var num=num1.toString().substr(0,4);
 var yzm2=document.getElementById("yzm2");
 document.codeimg.src="yzm.php?num="+num;
 yzm2.value=num;
}

yzm.php代码:

<?php
header("Content-type: image/png");
$im=imagecreate(66,22);       //创建画布
$black=imagecolorallocate($im,0,0,0);   //定义背景
$white=imagecolorallocate($im,255,255,255);  //定义背景
$gray=imagecolorallocate($im,200,200,200);  //定义背景
imagefill($im,0,0,$gray);      //填充颜色
for($i=0;$i<4;$i++){ //定义4位随机数
 $str=mt_rand(1,5);  //定义随机字符所在位置的的Y坐标
 $size=mt_rand(6,9); //定义随机字符的字体
 $authnum=substr($_GET[num],$i,1);  //获取超级链接中传递的验证码
 imagestring($im,$size,(3+$i*15),$str,$authnum,imagecolorallocate($im,rand(0,250),rand(0,250),rand(0,250)));//rand(0,500)数字的模糊程度
}       //水平输出字符串
for($i=0;$i<200;$i++){  //执行for循环,为验证码添加模糊背景
  $randcolor=imagecolorallocate($im,rand(0,255),rand(0,255),rand(0,255)); //创建背景
  imagesetpixel($im,rand()%70,rand()%30,$randcolor);  //绘制单一元素
}
imagepng($im);    //生成png图像
imagedestroy($im);   //销毁图像
?>

注意:PHP需要配置才能执行相关方法。

运行效果:

PHP 相关文章推荐
php读取数据库信息的几种方法
May 24 PHP
字母顺序颠倒而单词顺序不变的php代码
Aug 08 PHP
.htaccess文件保护实例讲解
Feb 06 PHP
用PHP即时捕捉PHP中的错误并发送email通知的实现代码
Jan 19 PHP
PHP session_start()问题解疑(详细介绍)
Jul 05 PHP
PHP小教程之实现双向链表
Jun 12 PHP
异步加载技术实现当滚动条到最底部的瀑布流效果
Sep 16 PHP
php中switch语句用法详解
Aug 17 PHP
使用Huagepage和PGO来提升PHP7的执行性能
Nov 30 PHP
PHP数学运算与数据处理实例分析
Apr 01 PHP
Symfony2获取web目录绝对路径、相对路径、网址的方法
Nov 14 PHP
PHP获取HTTP body内容的方法
Dec 31 PHP
微信支付开发教程(一)微信支付URL配置
May 28 #PHP
php中$美元符号与Zen Coding冲突问题解决方法分享
May 28 #PHP
php轻松实现中英文混排字符串截取
May 28 #PHP
分享一段php获取linux服务器状态的代码
May 27 #PHP
教你如何快捷的使用cmd访问mysql小技巧
May 26 #PHP
将二维数组转为一维数组的2种方法
May 26 #PHP
windwos下使用php连接oracle数据库的过程分享
May 26 #PHP
You might like
mayfish 数据入库验证代码
2010/04/30 PHP
openPNE常用方法分享
2011/11/29 PHP
PHP目录操作实例总结
2016/09/27 PHP
php unicode编码和字符串互转的方法
2020/08/12 PHP
laravel框架中间件简单使用方法示例
2020/01/25 PHP
Js中sort()方法的用法
2006/11/04 Javascript
使用jQuery清空file文件域的解决方案
2013/04/12 Javascript
用js将内容复制到剪贴板兼容浏览器
2014/03/18 Javascript
js中定义一个变量并判断其是否为空的方法
2014/05/13 Javascript
Javascript基础知识(三)BOM,DOM总结
2014/09/29 Javascript
node.js中的fs.fchownSync方法使用说明
2014/12/16 Javascript
jQuery点击按钮弹出遮罩层且内容居中特效
2015/12/14 Javascript
详解AngularJS中$http缓存以及处理多个$http请求的方法
2016/02/06 Javascript
DWR中各种java方法的调用
2016/05/04 Javascript
jQuery实现自动调用和触发某个事件的方法
2016/11/18 Javascript
使用UrlConnection实现后台模拟http请求的简单实例
2017/01/04 Javascript
原生JS实现圆环拖拽效果
2017/04/07 Javascript
ES6学习教程之对象的扩展详解
2017/05/02 Javascript
javascript实现文件拖拽事件
2018/03/29 Javascript
vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)
2019/05/10 Javascript
JavaScript This指向问题详解
2019/11/25 Javascript
jQuery模仿ToDoList实现简单的待办事项列表
2019/12/30 jQuery
Python使用Scrapy爬虫框架全站爬取图片并保存本地的实现代码
2018/03/04 Python
Python中new方法的详解
2019/01/15 Python
Python3中的bytes和str类型详解
2019/05/02 Python
pytorch中获取模型input/output shape实例
2019/12/30 Python
个人社会实践自我鉴定
2014/03/24 职场文书
巾帼文明岗汇报材料
2014/12/24 职场文书
老公婚前保证书
2015/02/28 职场文书
宾馆前台接待岗位职责
2015/04/02 职场文书
2015年科室工作总结
2015/04/10 职场文书
法定代表人身份证明书
2015/06/18 职场文书
字典算法实现及操作 --python(实用)
2021/03/31 Python
使用Redis实现秒杀功能的简单方法
2021/05/08 Redis
浅谈tf.train.Saver()与tf.train.import_meta_graph的要点
2021/05/26 Python
使用redis实现延迟通知功能(Redis过期键通知)
2021/09/04 Redis