js中的事件onchange案例

来源:互联网 发布:java office转换成pdf 编辑:程序博客网 时间:2024/05/21 11:12
onchange:域内容被改变的事件
    需求:实现二级联动
<select id="city">
  <option value="bj">北京</option>
  <option value="tj">天津</option>
  <option value="sh">上海</option>
</select>
<select id="area">
  <option>海淀</option>
  <option>朝阳</option>
  <option>东城</option>
</select>
<script type="text/javascript">
                   var city=document.getElementById("city");
  city.onchange=function(){
      var optionVal=city.value;
  switch(optionVal){
  case 'bj':
  var area=document.getElementById("area");
  area.innerHTML="<option>海淀</option><option>朝阳</option><option>东城</option>";
   break;
  case 'sh':
   var area=document.getElementById("area");
   area.innerHTML="<option>浦东</option><option>朝阳</option><option>东城</option>";
  break;
  case 'tj':
  var area=document.getElementById("area");
  area.innerHTML="<option>津南</option><option>河西</option><option>北辰</option>";
  break;
  }
  }
</script>
原创粉丝点击