Javascript验证码的生成和 C#生成验证码以及 iframe的使用——模仿京东网练习的总结

来源：互联网发布：苹果mac官方壁纸海浪编辑：程序博客网时间：2024/06/06 04:47

项目总结：

Javascript验证码的生成

var code ;

function createCode()

{

code = "";

var codeLength = 4;

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

}

if(checkCode)

{

checkCode.className="code";

checkCode.innerHTML = code;

}

function validate ()

{

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

if(inputCode.length <=0)

{

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

return 1;

}

else if(inputCode.toUpperCase()!= code )

{

alert("验证码错误");

createCode();

return 2;

}

else

{

return 3;

}

C#生成验证码

一、生成随机文字

public string CreateRandomNum(int NumCount)

{

string allChar = "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,W,X,Z,Y";

string[] allCharArray = allChar.Split(',');

string randomNum = "";

int temp = -1;//记录上次随机数的数值¦尽量避免产生相同的数

Random rand = new Random();

for (int i = 0; i < NumCount; i++)

{

if (temp != -1)

{

rand = new Random(i * temp * ((int)DateTime.Now.Ticks));

}

int t = rand.Next(35);

if (temp == t)

{

return CreateRandomNum(NumCount);

}

temp = t;

randomNum += allCharArray[t];

}

return randomNum;

}

二、生成图片

//生成图片?

private void CreateImage(string validateNum)

{

if (validateNum == null || validateNum.Trim() == String.Empty)

return;

//生成Bitmap图像?

System.Drawing.Bitmap image = new System.Drawing.Bitmap(validateNum.Length * 12 + 10, 22);

Graphics g = Graphics.FromImage(image);

try

{

//生成随机生成器

Random random = new Random();

//清除图片背景色

g.Clear(Color.White);

//画图片的背景噪音线?

for (int i = 0; i < 25; i++)

{

int x1 = random.Next(image.Width);

int x2 = random.Next(image.Width);

int y1 = random.Next(image.Height);

int y2 = random.Next(image.Height);

g.DrawLine(new Pen(Color.Silver), x1, y1, x2, y2);

}

Font font = new System.Drawing.Font("Arial", 13, (System.Drawing.FontStyle.Bold | System.Drawing.FontStyle.Italic));

System.Drawing.Drawing2D.LinearGradientBrush brush = new System.Drawing.Drawing2D.LinearGradientBrush(new Rectangle(0, 0, image.Width, image.Height), Color.Blue, Color.DarkRed, 1.2f, true);

g.DrawString(validateNum, font, brush, 2, 2);

//画图片的前景噪声点

for (int i = 0; i < 100; i++)

{

int x = random.Next(image.Width);

int y = random.Next(image.Height);

image.SetPixel(x, y, Color.FromArgb(random.Next()));

}

//画图片的边框线?

g.DrawRectangle(new Pen(Color.Silver), 0, 0, image.Width - 1, image.Height - 1);

System.IO.MemoryStream ms = new System.IO.MemoryStream();

//将图像保存到指定的流

image.Save(ms, System.Drawing.Imaging.ImageFormat.Gif);

Response.ClearContent();

Response.ContentType = "image/Gif";

Response.BinaryWrite(ms.ToArray());

}

catch

{

g.Dispose();

image.Dispose();

}

Iframe的使用完成父页面和子页面的刷新

Iframe标记的使用格式是:

src：文件的路径，既可是HTML文件，也可以是文本、ASP等；

width、height："画中画"区域的宽与高；

scrolling:当SRC的指定的HTML文件在指定的区域不显不完时，滚动选项，如果设置为NO，则不出现滚动条；如为Auto：则自动出现滚动

条；如为Yes，则显示;

FrameBorder：区域边框的宽度，为了让'画中画'与邻近的内容相融合，常设置为0。

比如:

二、父窗体与浮动帧之间的相互控制

在脚本语言与对象层次中，包含Iframe的窗口我们称之为父窗体，而浮动帧则称为子窗体，弄清这两者的关系很重要，因为要在父窗体

中访问子窗体或相反都必须清楚对象层次，才能通过程序来访问并控制窗体。

1、在父窗体中访问并控制子窗体中的对象

在父窗体中，Iframe即子窗体是document对象的一个子对象，可以直接在脚本中访问子窗体中的对象。

现在就有一个问题，即，我们怎样来控制这个Iframe，这里需要讲一下Iframe对象。当我们给这个标记设置了ID 属性后，就可通过文档

对象模型DOM对Iframe所含的HTML进行一系列控制。

比如在example.htm里嵌入test.htm文件，并控制test.htm里一些标记对象：

test.htm文件代码为:

<html>

<body>

<h1 id="myH1">hello,my boy</h1>

</body>

</html>

如我们要改变ID号为myH1的H1标记里的文字为hello,my dear，则可用:

document.myH1.innerText="hello,my dear"(其中，document可省)

在example.htm文件中，Iframe标记对象所指的子窗体与一般的DHTML对象模型一致，对对象访问控制方式一样，就不再赘述。

2、在子窗体中访问并控制父窗体中对象

在子窗体中我们可以通过其parent即父（双亲）对象来访问父窗口中的对象。

如example.htm：

<html>

<h1 id="myH2">hello,my wife</h1>

</body>

</html>

如果要在frame1.htm中访问ID号为myH2中的标题文字并将之改为"hello,my friend"，我们就可以这样写：

parent.myH2.innerText="hello,my friend"

这里parent对象就代表当前窗体(example.htm所在窗体)，要在子窗体中访问父窗体中的对象，无一例外都通过parent对象来进行。

Iframe虽然内嵌在另一个HTML文件中，但它保持相对的独立，是一个'独立王国'哟，在单一HTML中的特性同样适用于浮动帧中。

试想一下，通过Iframe标记，我们可将那些不变的内容以Iframe来表示，这样，不必重复写相同的内容，这有点象程序设计中的过程或

函数，减省了多少繁琐的手工劳动！另外，至关重要的是，它使页面的修改更为可行，因为，不必因为版式的调整而修改每个页面，你只需

修改一个父窗体的版式即可了。

有一点要注意，Nestscape浏览器不支持Iframe标记，但在时下IE的天下，这似乎也无大碍，广泛采用Iframe标记，既为自己

Javascript验证码的生成 和 C#生成验证码 以及 iframe的使用——模仿京东网练习的总结

Javascript验证码的生成和 C#生成验证码以及 iframe的使用——模仿京东网练习的总结