软件学堂

网游分类软件分类

JS验证列表框中的值是否重复

2012-11-08 来源:网络

【实例名称】

JS验证列表框中的值是否重复

【实例描述】

为了方便用户填写资料,可以下拉框的形式让用户选择值代替直接填写。但有时候下拉框并不能提供全部数据,此时需要用户自己填写。本例用来判断用户填写的数据是否已经存在于下拉框中。

【实例代码】

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页-学无忧(www.xue51.com)</title> <script language="javascript"> function chk() {     var txtValue = document.getElementById("txtValue"); //获取文本框的值     var sel = document.getElementById("sel");          //找到下拉框     for (var i=0; i<sel.length; i++)                    //遍历下拉框中的所有数据     {         if (txtValue.value==sel.options[i].text){       //如果输入的值等于下拉框中的值             alert("该值已经存在");         }     } } </script> </head> <body> <div id="mydiv"> <select id="sel" name="sel"> <option>China</option> <option>England</option> <option>German</option> </select> <input type="text" name="txtValue" id="txtValue"><br/> <input type="button" value="检测是否存在" onclick="chk();"> </div> </body> </html>

【运行效果】

 验证列表框中的值是否重复运行效果

【难点剖析】

本例首先获取文本框的值,然后对下拉框中的值进行遍历,这使用的是“for”循环语句。“sel.options[i].text用来获取下拉框中的当前值,用此值比较用户输入的值,如果相等,则表示用户输入的数据重复。

【源码下载】

为了JS代码的准确性,请点击:JS验证列表框中的值是否重复 进行本实例源码下载 

上一篇:JS判断用户输入是否为中文
下一篇:js检测输入框的统一方法

相关文章