无刷新验证码

最新推荐文章于 2024-05-06 18:16:21 发布

小亮Lee

最新推荐文章于 2024-05-06 18:16:21 发布

阅读量396

点赞数

文章标签：验证码 php

本文链接：https://blog.csdn.net/jj455909186/article/details/8939922

版权

这是我刚入手时,写的一个用户提交表,编写过程中参考过一写代码!

以下是完整的代码

//
路径及文件名/
/

//
 js/check.js /
//

//对用户的输入进行验证


function chkinput(form)
{
    if(form.username.value == '')
    {
        alert('请输入用户名!');
        form.username.focus();
        return false;
    }
    
    if(form.password.value == '')
    {
        alert('请输入注册密码!');
        form.password.focus();
        return false;
    }
    
    if(form.password.value.length < 6)
    {
        alert('密码长度应大于6个字节');
        form.password.focus();
        return false;
    }
    
    if(form.defPassword.value == '')
    {
        alert('请输入确认密码!');
        form.defPassword.focus();
        return false;
    }
    
    if(form.password.value != form.defPassword.value)
    {
        alert('密码和确认密码不同!');
        form.defPassword.focus();
        return false;
    }

    if(form.email.value == '')
    {
        alert('请输入E-mail地址!');
        form.email.focus();
        return false;
    }

    if(form.tel.value == '')
    {
        alert('请输入电话号码!');
        form.tel.focus();
        return false;
    }
    
    var t = /^([0-9]|[\-])+$/g;
    if(!t.test(form.tel.value) || form.tel.value.length > 18 || form.tel.value.length < 7)
    {
        alert('电话格式有误,请重新输入!');
        form.tel.focus();
        return false;
    }
    
    if(form.address.value == '')
    {
        alert('请输入地址!');
        form.address.focus();
        return false;
    }
    
    if(form.xym.value == '')
    {
        alert('请输入验证码!');
        form.xym.focus();
        return false;
    }
    
    if(form.xym.value != form.xym1.value)
    {
        alert('你输入的验证码有误,请重新输入!');
        form.xym.select();
        return false;
    }
    return true;
}

以上是对用户的输入进行检验,看是否符合要求!

//
  js/ref.js  /
//

//生成验证码,以及刷新

var num1 = Math.round(Math.random()*1000000);
var num = num1.toString().substr(0,4);
document.write("<img name=codeing src='xym.php?code="+ num +"'>");
form1.xym1.value = num;

function reCode()
{
    var num1 = Math.round(Math.random()*1000000);
    var num = num1.toString().substr(0,4);
    document.codeing.src = "xym.php?code="+ num;
    form1.xym1.value = num;
}

<?php
//
   xym.php   /
//

//接收随机验证码,并生成图片,添加干扰码

header('content-type:image/png');

srand((double)microtime()*1000000);
$im = imagecreate(60,20);
imagefill($im,0,0,imagecolorallocate($im,200,200,200));
$xym = $_GET['code'];
imagestring($im,rand(2,5),10,3,substr($xym,0,1),imagecolorallocate($im,0,rand(0,255),rand(0,255)));
imagestring($im,rand(2,5),20,3,substr($xym,1,1),imagecolorallocate($im,rand(0,255),0,rand(0,255)));
imagestring($im,rand(2,5),30,3,substr($xym,2,1),imagecolorallocate($im,rand(0,255),rand(0,255),0));
imagestring($im,rand(2,5),40,3,substr($xym,3,1),imagecolorallocate($im,0,rand(0,255),rand(0,255)));
for($i = 0; $i < 200; $i ++)
{
    imagesetpixel($im,rand()%70,rand()%30,imagecolorallocate($im,rand(0,255),rand(0,255),rand(0,255)));
}
imagepng($im);
imagedestroy($im);

?>

<!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=utf-8" />
<title>无刷新验证码</title>
<script type="text/javascript" src="js/check.js" ></script>


</head>

<!--      
//
  index.php  /
//
-->


<body>
<form name="form1" method="post" action="success.php" οnsubmit="return chkinput(this)" >

<tr>
    <td>用户名:</td>
    <td><input type="text" name="username" size="30" class="input" /></td>
</tr>
<br />
<tr>
    <td>密码:</td>
    <td><input type="password" name="password" size="30" class="input" /></td>
</tr>
<br />
<tr>
    <td>确认密码:</td>
    <td><input type="password" name="defPassword" size="30" class="input" /></td>
</tr>
<br />
<tr>
    <td>E-mail地址:</td>
    <td><input type="text" name="email" size="30" class="input" /></td>
</tr>
<br />
<tr>
    <td>联系电话:</td>
    <td><input type="text" name="tel" size="30" class="input" /></td>
</tr>
<br />
<tr>
    <td>联系地址:</td>
    <td><input type="text" name="address" size="30" class="input" /></td>
</tr>
<br />
<tr>
    <td>输入验证码:</td>
    <td>
        <input type="text" name="xym" size="6" class="input" />
        <input type="hidden" name="xym1" />
    </td>
    <script type="text/javascript" src="js/ref.js" ></script>
    <a href="#" οnclick="document.getEmementsByName(reCode())">看不清</a>
</tr>
<br />
<tr>
    <td></td>
    <td>
        <input type="submit" name="submit" value="注册" />
        <input type="reset" name="reset" value="重置" />
    </td>
</tr>

</form>

</body>
</html>

<?php

//
 success.php /
//


$username = $_POST['username'];
$password = $_POST['password'];
$email = $_POST['email'];
$tel = $_POST['tel'];
$address = $_POST['address'];

echo '用户名:'.$username;
echo "<br />密码:".$password;
echo "<br />E-mail:".$email;
echo "<br />电话:".$tel;
echo "<br />地址:".$address;

?>

小亮Lee

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
无刷新验证码

这是我刚入手时,写的一个用户提交表,编写过程中参考过一写代码!以下是完整的代码////////////////////////////////////// 路径及文件名//////////////////////////////////////////////////////////////// js/check.js /////////////////////////
复制链接

扫一扫