JS驗(yàn)證列表框中的值是否重復(fù)

2012/11/8 21:08:16作者：佚名來(lái)源：網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例名稱】

【實(shí)例描述】

為了方便用戶填寫資料，可以下拉框的形式讓用戶選擇值代替直接填寫。但有時(shí)候下拉框并不能提供全部數(shù)據(jù)，此時(shí)需要用戶自己填寫。本例用來(lái)判斷用戶填寫的數(shù)據(jù)是否已經(jīng)存在于下拉框中。

【實(shí)例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標(biāo)題頁(yè)-學(xué)無(wú)憂（m.wangbatian.cn）</title>
<script language="javascript">
function chk()
{
    var txtValue = document.getElementById("txtValue");
//獲取文本框的值
    var sel = document.getElementById("sel");          
//找到下拉框
    for (var i=0; i<sel.length; i++)                    
//遍歷下拉框中的所有數(shù)據(jù)
    {
        if (txtValue.value==sel.options[i].text){      
 //如果輸入的值等于下拉框中的值
            alert("該值已經(jīng)存在");
        }
    }
}
</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="檢測(cè)是否存在" onclick="chk();">
</div>
</body>
</html>

【運(yùn)行效果】

驗(yàn)證列表框中的值是否重復(fù)運(yùn)行效果