`
hz_chenwenbiao
  • 浏览: 994886 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

js 级联选择（转）

    博客分类：
  • JS
JavaScriptHTML 
阅读更多 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ww.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <script type="text/javascript">
       var classification_names = [["一年一班","一年二班"],["二年一班"],["三年一班"],["四年一班"]]; 
        var classificaiton_ids = [[1,2],[3],[4],[5]]; 
          
        function class_onchange(){ 
            //删除前面所有分类 
         var classifications = document.getElementById("classifications"); 

         classifications.options.length = 0;//清空前一次的选项
 
          //获得所选班级id 
          var classid=document.getElementById("class").value; 
          //获得id班级所有分类名 
          var thisClassifcationNames=classification_names[classid]; 
          if(!thisClassifcationNames){ 
               return; 
           } 
          //获得id班级所有分类id 
         var thisClassifcationIds=classificaiton_ids[classid]; 
           if(!thisClassifcationIds){ 
               return; 
          } 
          //设置该班级分类选项 
           var nullOption = document.createElement("option"); 
              nullOption.text="--请选择分类--"; 
               nullOption.value=""; 
               classifications.options.add(nullOption); 
          classifications.value=""; 
          for(var i=0;i<thisClassifcationNames.length;i++){ 
              var option = document.createElement("option"); 
             option.text=thisClassifcationNames[i]; 
            option.value=thisClassifcationIds[i]; 
             classifications.options.add(option); 
         }          
      } 
   </script>

  </head>
  
  <body>
    班级
	<select id="class" name="class" onchange="return class_onchange()">
		<option value="-1" selected="selected">
			请选择年级
		</option>
		<option value="0">
			一年级
		</option>
		<option value="1">
			二年级
		</option>
		<option value="2">
			三年级
		</option>
		<option value="3">
			四年级
		</option>
	</select>
	分类
	<select id="classifications" name="classifications">
		<option value="-1" selected="selected">
			请选择班级
		</option>
	</select>
  </body>
</html>
 
分享到：
| Lucene 3.0 原理与代码分析(转)
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics