selectedIndex返回被選中的option的index.

  /

 　　　　<label for="city">城市</label>
        <select id="city" name="school">
          <option>北京</option>
          <option>上海</option>
          <option>廣州</option>
        </select>
        <label for="school">學校</label>
        <select name="school" id="school">
          <option>北京大學1</option>
          <option>北京大學2</option>
          <option>北京大學3</option>
          <option>北京大學4</option>
          <option>北京大學5</option>
        </select>

 

/下拉列表聯動事件
    city.onchange = function () {
      
      //selectedIndex返回被選中的option的index.
      //.text 返回option中的文本值
      var text = this.children[this.selectedIndex].text;
      
      //清空select下面的所有option
      school.length = 0;
      switch (text) {
        case '北京':
          
          //add() 方法用於向 <select> 添加一個 <option> 元素。
          //new Option() 創建一個option標簽
          school.add(new Option('北京大學1'));
          school.add(new Option('北京大學2'));
          school.add(new Option('北京大學3'));
          break;
        case '上海':
          school.add(new Option('上海大學1'));
          school.add(new Option('上海大學2'));
          school.add(new Option('上海大學3'));
          break;
        case '廣州':
          school.add(new Option('廣州大學1'));
          school.add(new Option('廣州大學2'));
          school.add(new Option('廣州大學3'));
          break;
      }
    }