亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

原生js二級聯動效果

發布時間:2020-09-26 07:34:46 來源:腳本之家 閱讀:131 作者:Code_User 欄目:web開發

今天說的這個是原生js的二級聯動,在空白頁面里動態添加并作出相對應的效果。

//創建兩個下拉列表 select標簽 是下拉列表
   var sel = document.createElement("select");
   var sel1 = document.createElement("select");
   //添加到body
   document.body.appendChild(sel);
   document.body.appendChild(sel1);
//   創建一個數組
   var firstSelectArr = ["未選擇","醫院","學校","公司","星座"];
   var detailFirstArr = ["未選擇","院長","主任","大夫","護士"];
   var detailSecondArr = ["未選擇","校長","老師","學生","主任"];
   var arr2 = ["未選擇","CEO","職員","主任","下屬"];
   var arr3 = ["未選擇","白羊座","射手座","處女座","天秤座"];
   function addChild(arr,parentN){
    //封裝函數
    for(var i=0;i<arr.length;i++){
    //創建 option節點
    var opt = document.createElement("option");
    //設置顯示文字
    opt.innerText = arr[i];
    //把節點添加到sel中
    parentN.appendChild(opt);
    
   }
   }
   //調用函數 給第一個select添加option
   addChild(firstSelectArr,sel)
   
   //循環創建多個下拉選項
   
   //給第一個下拉列表添加onchange事件
   //onchange事件:當元素的值發生改變時,觸發此事件。
   sel.onchange = function (){
//    selectdIndex.下拉列表的索引 
    console.log(sel.selectedIndex);
     switch (sel.selectedIndex){
      case 0:
      alert("未選擇");
      break;
      case 1:
      delectOldOpt();
      addChild(detailFirstArr,sel1);
      break;
      case 2:
      delectOldOpt();
      addChild(detailSecondArr,sel1);
      break;
      case 3:
      delectOldOpt();
      addChild(arr2,sel1);
      break;
      case 4:
      delectOldOpt();
     addChild(arr3,sel1);
      break;
     }
     
     
    }
   //刪除select原來的option
   function delectOldOpt(){
    //到這刪除下拉列表中的選項
    for(var i=sel1.childNodes.length-1;i>=0;i--){
     //刪除選項
     sel1.removeChild(sel1.childNodes[i]);
    }
    
   }

這樣就完成了一個最簡單的二級聯動,希望可以幫到你們!

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持億速云。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

冕宁县| 横山县| 长顺县| 来安县| 镇宁| 南华县| 札达县| 醴陵市| 罗定市| 文成县| 西乡县| 天长市| 德格县| 安吉县| 华池县| 徐汇区| 盐津县| 大港区| 金山区| 蒙阴县| 雅江县| 迭部县| 阿克苏市| 富平县| 福海县| 临西县| 闵行区| 灌云县| 龙江县| 卢湾区| 金平| 西和县| 商丘市| 清丰县| 宜黄县| 池州市| 泽库县| 陆河县| 建昌县| 墨玉县| 沛县|