js生成验证码并直接在前端判断

js生成验证码并直接在前端判断

<script type="text/javascript" src="img/jquery-1.5.1.min.js"></script><script language="javascript" type="text/javascript">var code; //在全局 定义验证码var code2; //在全局 定义验证码function createCode（） {code = "";var checkCode = document.getElementById（"checkCode"）;function RndNum（n） {var rnd = "";for （var i = 0; i < n; i++）rnd += Math.floor（Math.random（） * 10）;return rnd;}var num = RndNum（2）;var num2 = RndNum（2）;code = num + "+" + num2 + "=";code2 = parseInt（num） + parseInt（num2）if （checkCode） {checkCode.className = "code";checkCode.value = code;}}</script><script type="text/javascript">$（document）.ready（function （） {$（"#input1"）.blur（function （） {var inputCode = document.getElementById（"input1"）.value;if （inputCode.length <= 0） {alert（"请输入验证码！"）;}else if （inputCode ！= code2） {alert（"验证码输入错误！"）;createCode（）; //刷新验证码}else {alert（"^-^ OK"）;}}）;}）</script>

HTML:

 <form action="#"> <input type="text" id="input1" /><input type="text" onclick="createCode（）" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px;background: #660099"/><br /></form>

css:

<style type="text/css">.code{font-family: Arial;font-style: italic;color: Red;border: 0;padding: 2px 3px;letter-spacing: 3px;font-weight: bolder;}.unchanged{border: 0;}</style>

以上所述就是本文的全部内容了，希望大家能够喜欢。