课程设计报告_3.docVIP

九江职业技术学院 网站脚本技术课程设计 设计题目 基于javascript的验证码生成制作 专业班级 网络1201 组员姓名 刘美琳 刘红红 蔡源涵 学 号 指导教师 高楷模 日 期 2014.06.16~2014.06.20  课程设计任务书 院系： 信息学院 专业： 网络技术 班级： 网络1201 学号： 一、课程设计时间 2014年06月16日至2014年06月20日，共计1周。 二、课程设计内容 使用html+javascript+css 完成以下任务： 1、能够熟练使用css结合html实现登录验证码。 2、熟练使用javascrip中的对象，实现登录。 三、课程设计要求 1. 课程设计质量： 熟练使用javascript中的对象，实现登录。 登录时需弹出对话框提示。 设计过程中充分考虑浏览器兼容等问题，并做适当处理。 代码应适当缩进，并给出必要的注释，以增强程序的可读性。 2. 课程设计说明书： 课程结束后，上交课程设计报告书和相关的网页。课程设计报告书的格式和内容参见提供的模板。 四、指导教师和学生签字 指导教师： 学生签名： 刘美琳 关键字：登录、javascript、html  目录 一、 前言 3 1.1课程设计思路 3 1.2课程设计目标 3 二、关键技术 4 2.1通过定义字符集数字、字母实组成验证码 4 2.2通过函数表达式for循环生成6位验证码 4 2.3通过输入验证码确定提交弹出提示框 4 2.4完成效果 5 三、 详细设计 6 3.1完整代码 6 3.2登录页面效果 9 四、课设总结 10 五、参考文献 10 前言 1.1课程设计思路 以登录页面为主来实现验证码，验证码可以有效的防止某一些注册用户用特定的程序暴力破解进行不断地登录尝试，实际上用验证码是很多网站通行的方式，现在我们用比较简单的方式来实现这一功能。所谓验证码，就是将一串随机产生的数字或符号，生成一幅图片， 图片里加上一些干扰象素（防止OCR），由用户肉眼识别其中的验证码信息，输入表单提交网站验证，验证成功后才能使用某项功能。  二、关键技术 2.1通过定义字符集数字、字母实组成验证码 var codeChars = 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, 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); 2.2 通过函数表达式for循环生成6位验证码 var codeLength = 6; for (var i = 0; i codeLength; i++) { var charNum = Math.floor(Math.random() * 52); code += codeChars[charNum]; } if (checkCode) { checkCode.className = code; checkCode.innerHTML = code; } } 2.3 通过输入验证码确定提交弹出提示框 function validateCode() { var inputCode = document.getElementById(inputCode).value; if (inputCode.length = 0) { alert(请输入验证码！); } else if (inputCode.toUpperCase() != code.toUpperCase()) { alert(验证码输入有误！); createCode();