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 相关文章推荐
一个可查询所有表的“通用”查询分页类
Oct 09 PHP
php 表单数据的获取代码
Mar 10 PHP
php iconv() : Detected an illegal character in input string
Dec 05 PHP
基于PHP 面向对象之成员方法详解
May 04 PHP
深入HTTP响应状态码速查表的详解
Jun 07 PHP
php站内搜索关键词变亮的实现方法
Dec 30 PHP
yum命令安装php7和相关扩展
Jul 04 PHP
WHOOPS PHP调试库的使用
Sep 29 PHP
Laravel中的Blade模板引擎示例详解
Oct 10 PHP
php实现微信企业付款到个人零钱功能
Oct 09 PHP
Laravel 将数据表的数据导出,并生成seeds种子文件的方法
Oct 09 PHP
4种Windows系统下Laravel框架的开发环境安装及部署方法详解
Apr 06 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
欧美媒体选出10年前最流行的17部动画
2017/01/18 日漫
解析在zend Farmework下如何创立一个FORM表单
2013/06/28 PHP
PHP单链表的实现代码
2016/07/05 PHP
Prototype ObjectRange对象学习
2009/07/19 Javascript
JS添加删除一组文本框并对输入信息加以验证判断其正确性
2013/04/11 Javascript
jQuery Mobile 导航栏代码
2013/11/01 Javascript
jquery鼠标停止移动事件
2013/12/21 Javascript
jquery插件开发之实现google+圈子选择功能
2014/03/10 Javascript
jQuery分别获取选中的复选框值的示例
2014/06/17 Javascript
jquery实现鼠标滑过小图时显示大图的方法
2015/01/14 Javascript
Javascript监视变量变化的方法
2015/06/09 Javascript
jquery.validate提示错误信息位置方法
2016/01/22 Javascript
详解JS中的立即执行函数
2017/02/24 Javascript
前端开发之CSS原理详解
2017/03/11 Javascript
jquery PrintArea 实现票据的套打功能(代码)
2017/03/17 Javascript
从零开始实现Vue简单的Toast插件
2018/12/03 Javascript
vue-cli2.0转3.0之项目搭建的详细步骤
2018/12/11 Javascript
angular多语言配置详解
2019/05/16 Javascript
序列化模块json代码实例详解
2020/03/03 Javascript
python编码最佳实践之总结
2016/02/14 Python
python学习教程之使用py2exe打包
2017/09/24 Python
不同版本中Python matplotlib.pyplot.draw()界面绘制异常问题的解决
2017/09/24 Python
Python用 KNN 进行验证码识别的实现方法
2018/02/06 Python
python利用tkinter实现屏保
2019/07/30 Python
np.dot()函数的用法详解
2020/01/17 Python
python入门之井字棋小游戏
2020/03/05 Python
使用Python项目生成所有依赖包的清单方式
2020/07/13 Python
Python爬虫防封ip的一些技巧
2020/08/06 Python
如何利用python发送邮件
2020/09/26 Python
使用 css3 transform 属性来变换背景图的方法
2019/05/07 HTML / CSS
英国和爱尔兰的自炊式豪华度假小屋:Rural Retreats
2018/06/08 全球购物
收银出纳员岗位职责
2014/02/23 职场文书
多媒体编辑专业毕业生求职信
2014/06/13 职场文书
大学生求职信
2014/06/17 职场文书
财产保全担保书
2015/01/20 职场文书
绍兴鲁迅故居导游词
2015/02/09 职场文书