中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

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

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

原生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

巴东县| 迁西县| 正镶白旗| 遂宁市| 沈丘县| 黄石市| 甘孜| 三原县| 界首市| 柘城县| 石狮市| 新绛县| 扎囊县| 连城县| 阿瓦提县| 若尔盖县| 大连市| 商丘市| 汨罗市| 嘉义县| 公主岭市| 安陆市| 丘北县| 大宁县| 樟树市| 蒙阴县| 峡江县| 宿松县| 淮滨县| 乌兰浩特市| 稻城县| 泰安市| 乌兰察布市| 松原市| 华池县| 聂拉木县| 平原县| 沁水县| 荣昌县| 开封市| 定兴县|