html图片验证码代码（html加入图片验证码）

今天给各位分享html图片验证码代码的知识，其中也会对html加入图片验证码进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！

本文目录一览：

• 1、验证码的html怎么写
• 2、2、javascript+CSS+Html实现用户注册及登录的格式验证。在用户登录功能中试加入图片验证码功能
• 3、HTML 怎么写验证码
• 4、用html做的一个form+table注册页面里有一个验证码，要怎么写这个js代码？？
• 5、html怎么实现图片验证码
• 6、如何在html中的文本框中加入验证码

验证码的html怎么写

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

titleJS生成验证码/title

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];

    }

    //alert(code);

    if (checkCode) {

        checkCode.className = "code";

        checkCode.value = code;

    }

}

function validate() {

    var inputCode = document.getElementById("input1").value;

    if (inputCode.length = 0) {

        alert("请输入验证码！");

    } else if (inputCode != code) {

        alert("验证码输入错误！");

    createCode();//刷新验证码   

    } else {

    alert("^-^ OK");

    }

}

/script

/head

body onload="createCode()"

form action="#"

    input type="text" id="input1" / input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px" /br /

    input id="Button1" onclick="validate();" type="button" value="确定" /

/form

/body

/html

2、javascript+CSS+Html实现用户注册及登录的格式验证。在用户登录功能中试加入图片验证码功能

下面是关键代码，如果剩下的你都搞不懂，我就无语了

JS

script type="text/javascript" language="javascript"

function reloadcodeOne(){//刷新验证码函数

var verify = document.getElementById('checkCodeImg');

verify.setAttribute('src', 'validateCode?dt=' + Math.random());

}

script type="text/javascript"

html

p

label验证码：/label

input class="code" value="请输入验证码" title="请输入验证码" name="rendCode" id="rendCode" onfocus="if (value =='请输入验证码'){value =''}" onblur="if (value ==''){value='请输入验证码'}" type="text" size="6" /

spanimg id="checkCodeImg" src="validateCodeServlet" onclick="javascript:reloadcodeOne();" alt="" width="75" height="24" //span

/p

java代码

package com.zhihui.action.common;

import java.awt.Color;

import java.awt.Font;

import java.awt.Graphics2D;

import java.awt.image.BufferedImage;

import java.util.Random;

import javax.imageio.ImageIO;

import javax.servlet.ServletException;

import javax.servlet.ServletOutputStream;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import javax.servlet.http.HttpSession;

import org.apache.struts2.ServletActionContext;

import com.zhihui.action.base.BaseAction;

/**

* p

* 校验码控制器

* /p

*

* @author liurong

* @version ValidateCodeServlet.java,v 0.1 2008-11-20 上午09:22:31 Administrator

* Exp

*/

public class ValidateCodeAction extends BaseAction {

private static final long serialVersionUID = 1L;

// 验证码图片的宽度。

private int width = 10;

// 验证码图片的高度。

private int height = 5;

// 验证码字符个数

private int codeCount = 5;

private int x = 0;

// 字体高度

private int fontHeight;

private int codeY;

/*char[] codeSequence = { 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J',

'K', 'L', 'M', 'N', 'P', 'R', 'S', 'T', 'U', 'V', 'W',

'X', 'Y', 'Z', '2', '3', '4', '5', '6', '7', '8', '9' };*/

char[] codeSequence = {'1', '2', '3', '4', '5', '6', '7', '8', '9', '0' };

HttpServletRequest req=ServletActionContext.getRequest();

HttpServletResponse resp=ServletActionContext.getResponse();

public String execute()

throws ServletException, java.io.IOException {

// 宽度

String strWidth = "70";

// 高度

String strHeight = "22";

// 字符个数

String strCodeCount = "5";

width = Integer.parseInt(strWidth);

height = Integer.parseInt(strHeight);

codeCount = Integer.parseInt(strCodeCount);

x = width / (codeCount);

fontHeight = height - 4;

codeY = height - 4;

// 定义图像buffer

BufferedImage buffImg = new BufferedImage(width, height,

BufferedImage.TYPE_INT_RGB);

Graphics2D g = buffImg.createGraphics();

Random random = new Random();

// 将图像填充为白色

g.setColor(Color.WHITE);

g.fillRect(0, 0, width, height);

Font font = new Font("Fixedsys", Font.PLAIN, fontHeight);

g.setFont(font);

g.setColor(Color.BLACK);

g.drawRect(0, 0, width - 1, height - 1);

g.setColor(Color.BLACK);

for (int i = 0; i 15; i++) {

int x = random.nextInt(width);

int y = random.nextInt(height);

int xl = random.nextInt(8);

int yl = random.nextInt(8);

g.drawLine(x, y, x + xl, y + yl);

}

// randomCode用于保存随机产生的验证码，以便用户登录后进行验证。

StringBuffer randomCode = new StringBuffer();

int red = 0, green = 0, blue = 0;

for (int i = 0; i codeCount; i++) {

String strRand = String.valueOf(codeSequence[random.nextInt(codeSequence.length)]);

red = 0;//random.nextInt(255);

green = 0;//random.nextInt(255);

blue = 0;//random.nextInt(255);

g.setColor(new Color(red, green, blue));

g.drawString(strRand, (i ) * x, codeY);

randomCode.append(strRand);

}

HttpSession session = req.getSession();

session.setAttribute("validateCode", randomCode.toString());

resp.setHeader("Pragma", "no-cache");

resp.setHeader("Cache-Control", "no-cache");

resp.setDateHeader("Expires", 0);

resp.setContentType("image/jpeg");

ServletOutputStream sos = resp.getOutputStream();

ImageIO.write(buffImg, "jpeg", sos);

sos.close();

return null;

}

public int getWidth() {

return width;

}

public void setWidth(int width) {

this.width = width;

}

public int getHeight() {

return height;

}

public void setHeight(int height) {

this.height = height;

}

public int getCodeCount() {

return codeCount;

}

public void setCodeCount(int codeCount) {

this.codeCount = codeCount;

}

public int getX() {

return x;

}

public void setX(int x) {

this.x = x;

}

public int getFontHeight() {

return fontHeight;

}

public void setFontHeight(int fontHeight) {

this.fontHeight = fontHeight;

}

public int getCodeY() {

return codeY;

}

public void setCodeY(int codeY) {

this.codeY = codeY;

}

public char[] getCodeSequence() {

return codeSequence;

}

public void setCodeSequence(char[] codeSequence) {

this.codeSequence = codeSequence;

}

public HttpServletRequest getReq() {

return req;

}

public void setReq(HttpServletRequest req) {

this.req = req;

}

public HttpServletResponse getResp() {

return resp;

}

public void setResp(HttpServletResponse resp) {

this.resp = resp;

}

}

HTML 怎么写验证码

你好 验证码一般是由后台生成的图片，如果用HTML制作的话很容易被软件获取，如果要用HTML的话就用javascript生成随机数，然后在写一个英文字母的数组，然后用随机数来取下标吧，如果你只用数字验证码的话随机数就可以，不过验证码不建议用javascript制作。希望我的回答能够帮助到你，如果还有什么疑问可以继续追问。

用html做的一个form+table注册页面里有一个验证码，要怎么写这个js代码？？

可以用JS做个简单的验证码 script language="javascript"var code; //在全局 定义验证码

function createCode()

{ //创建验证码函数

code = "";

var codeLength =5;//验证码的长度

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;icodeLength;i++)

{

var charIndex =Math.floor(Math.random()*36);

code +=selectChar[charIndex];

}// 设置验证码的显示样式，并显示

document.getElementById("discode").style.fontFamily="Fixedsys"; //设置字体

document.getElementById("discode").style.letterSpacing="3px"; //字体间距

document.getElementById("discode").style.color="#ff0000"; //字体颜色

document.getElementById("discode").innerHTML=code; // 显示

}/script 把上面一段JS代码放到head/head标签中在页面装载的时候，调用验证码创建函数 body onload="createCode()

"在验证码输入框的后面放一个标签 span id="discode"/span

html怎么实现图片验证码

HTML

HEAD

TITLE生成验证码/TITLE

SCRIPT LANGUAGE="JavaScript"

function createCode(len)

{

var seed = new Array(

'abcdefghijklmnopqrstuvwxyz',

'ABCDEFGHIJKLMNOPQRSTUVWXYZ',

'0123456789'

); //创建需要的数据数组

var idx,i;

var result = ''; //返回的结果变量

for (i=0; ilen; i++) //根据指定的长度

{

idx = Math.floor(Math.random()*3); //获得随机数据的整数部分-获取一个随机整数

result += seed[idx].substr(Math.floor(Math.random()*(seed[idx].length)), 1);//根据随机数获取数据中一个值

}

return result; //返回随机结果

}

function test() {

var inputRandom=document.getElementById("inputRandom").value;

var autoRandom=document.getElementById("autoRandom").innerHTML;

if(inputRandom==autoRandom) {

alert("通过验证");

} else {

alert("没有通过验证");

}

}

/SCRIPT

/HEAD

BODY

验证码长度：

SELECT id="sel"

option value=11/option

option value=33/option

option value=55/option

option value=7 selected7/option

option value=99/option

/SELECT

BR

table

tr

td验证码：/td

tdinput type="text" id="inputRandom"/td

tdlabel id="autoRandom" value=""/labelINPUT TYPE="button" VALUE="获取验证码" ONCLICK="autoRandom.innerHTML=createCode(sel.value)"/td

tdinput type="button" value="验证" onclick="test()"/td

/tr

/table

script type="text/javascript"

window.onload()=autoRandom.innerHTML=createCode(sel.value);

/script

/BODY

/HTML

分享

本回答

如何在html中的文本框中加入验证码

在html中的文本框中加入验证码，可以通过以下代码实现：

验证码通过GD生成PNG图片，并把$randval随机数字赋给

在通过用户输入的$_POST进行比较，来判断是否正确。达到需要实现的功能，需要修改php.ini文件，使php支持GD库。

在文本框中加入验证码？

还是用一段代码生成验证码图片然后在html页面中显示出来？如果是后者可以帮你解决一下

关于html图片验证码代码和html加入图片验证码的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。