下拉框联动

最新推荐文章于 2025-08-14 17:31:00 发布

win_gd

最新推荐文章于 2025-08-14 17:31:00 发布

阅读量745

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： arrays server function javascript action input

本文链接：https://blog.youkuaiyun.com/win_gd/article/details/7221290

javascript 专栏收录该内容

3 篇文章

订阅专栏

<html>   
<head><title>test select changed</title></head>   
<script language='javascript'>   
  
// 更新二级服务类型   
function updateSubServer() {   
   var arrays = [['100', '合肥', '101'],['100', '阜阳','102'],['200', '南京', '201'], ['200', '苏州', '202']];   
   clear_sub_server();    
   var sub_servers2 = document.getElementById("sub_server");      
   var option_1 = null;   
   for (var i = 0; i < arrays.length; i++) {   
       option_1 = document.createElement("option");   
       if (document.forms[0].server.options[document.forms[0].server.selectedIndex].value == arrays[i][0]) {   
          option_1.text = arrays[i][1];   
           option_1.value = arrays[i][2];   
         sub_servers2.add(option_1);   
      }   
    }   
}   
 
// 清除二级服务类型，只留一个空的选择项   
function clear_sub_server() {   
    var sub_servers = document.getElementById("sub_server");   
    while(sub_servers.childNodes.length > 0) {   
        sub_servers.removeChild(sub_servers.childNodes[0]);   
    }   
    var option_2 = document.createElement("option");   
    option_2.text = "---请选择---";   
    option_2.value = "";   
   sub_servers.add(option_2);   
}   
  
// 输入校验   
function checkInput() {    
    if (document.forms[0].server.value == '') {   
        alert('请输入服务类型!');   
        return false;   
   }   
    if (document.forms[0].sub_server.value == '') {   
      alert('请输入二级服务类型!');   
      return false;   
   }   
   document.forms[0].submit();   
}   
</script>   
<body>   
<form name='form1' action='#' method='get' onsubmit="checkInput();return false;">   
	   省份：<select name='server' id='server' onchange='updateSubServer();'>   
							   <option value=''>---请选择---</option>   
							   <option value='100'>安徽</option>   
							   <option value='200'>江苏</option>   
							</select>   
市：<select name='sub_server' id='sub_server'>   
									<option value=''>---请选择---</option>   
							   </select>   
    <input type='submit' />   
</form>   
</body>   
</html>