基于JS的简单算术题式验证码的实现

今天心血来潮搜索了下验证码的实现方式,仿照网上一个6位字符型的验证码实现了一个100以内算术题式的验证码。代码如下,备用:

验证码
效果如下:


上述实现主要还是基于jQuery,其实也可以不用。JavaScript 1.6新添加了一系列函数,其中就包含document.querySelectordocument.querySelectorAll。这两个函数的作用与jQuery的元素选择器如出一辙,即通过传入类似于 ".class" 、 "#id" 等这样的字符串选择符来获取元素;区别在于querySelector 函数获取的是符合选择符的第一个DOM元素,而 querySelectorAll 函数获取的是符合选择符的DOM元素数组。获取到元素之后,就可以通过相应的事件(如onfocus、onclick等)来操作数据了。

另外,验证码的元素除了用

以外,还可能使用,只不过需要对其做一定的处理:如去掉输入框的边框(border: none),设置为只读(readonly)。

最后附上验证码的背景图片 code_bg.jpg :


你可能感兴趣的:(基于JS的简单算术题式验证码的实现)