• <fieldset id="8imwq"><menu id="8imwq"></menu></fieldset>
  • <bdo id="8imwq"><input id="8imwq"></input></bdo>
    最新文章專(zhuān)題視頻專(zhuān)題問(wèn)答1問(wèn)答10問(wèn)答100問(wèn)答1000問(wèn)答2000關(guān)鍵字專(zhuān)題1關(guān)鍵字專(zhuān)題50關(guān)鍵字專(zhuān)題500關(guān)鍵字專(zhuān)題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專(zhuān)題關(guān)鍵字專(zhuān)題tag2tag3文章專(zhuān)題文章專(zhuān)題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專(zhuān)題3
    問(wèn)答文章1 問(wèn)答文章501 問(wèn)答文章1001 問(wèn)答文章1501 問(wèn)答文章2001 問(wèn)答文章2501 問(wèn)答文章3001 問(wèn)答文章3501 問(wèn)答文章4001 問(wèn)答文章4501 問(wèn)答文章5001 問(wèn)答文章5501 問(wèn)答文章6001 問(wèn)答文章6501 問(wèn)答文章7001 問(wèn)答文章7501 問(wèn)答文章8001 問(wèn)答文章8501 問(wèn)答文章9001 問(wèn)答文章9501
    當(dāng)前位置: 首頁(yè) - 科技 - 知識(shí)百科 - 正文

    ajax實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng)效果

    來(lái)源:懂視網(wǎng) 責(zé)編:小采 時(shí)間:2020-11-27 22:51:33
    文檔

    ajax實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng)效果

    ajax實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng)效果:本文利用ajax技術(shù)從數(shù)據(jù)庫(kù)中獲取數(shù)據(jù),動(dòng)態(tài)實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng),效果圖如下: 前端js代碼如下: <script type=text/javascript src=jquery/jquery-1.9.1.min.js></script> <script type=tex
    推薦度:
    導(dǎo)讀ajax實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng)效果:本文利用ajax技術(shù)從數(shù)據(jù)庫(kù)中獲取數(shù)據(jù),動(dòng)態(tài)實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng),效果圖如下: 前端js代碼如下: <script type=text/javascript src=jquery/jquery-1.9.1.min.js></script> <script type=tex

    本文利用ajax技術(shù)從數(shù)據(jù)庫(kù)中獲取數(shù)據(jù),動(dòng)態(tài)實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng),效果圖如下:

    前端js代碼如下:

    <script type="text/javascript" src="jquery/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $.ajax({
    type:"get",
    dataType:"text",
    url:"GetItemAction?itemlevel=1",
     success:function(data){
     // 由JSON字符串轉(zhuǎn)換為JSON對(duì)象
     var objJSON=eval("("+data+")");
     var len=objJSON.itemInfo.length; 
    
     var objSelect=document.getElementById("firstlevel");
     for(var i=0;i<len;i++){
     var op=new Option(objJSON.itemInfo[i].itemname,objJSON.itemInfo[i].itemcode);
     objSelect.add(op);
     } 
    
     },
    error: function (XMLHttpRequest, textStatus, errorThrown) { 
     alert(errorThrown); 
     }
    });
    });
    
    //顯示二級(jí)分類(lèi)
    function firstlevel_Click(){
    var objfirst=document.getElementById("firstlevel");
    var index=objfirst.selectedIndex; //選中索引 
    var itemcode=objfirst.options[index].value; //選中值
    if(itemcode==0){
    alert("請(qǐng)選擇事件類(lèi)別");
    return;
    }
    // 刪除二級(jí)分類(lèi)保留第一個(gè)
    var objsecond=document.getElementById("secondlevel");
    for(var i=objsecond.options.length-1;i>0;i--){
    objsecond.options.remove(i);
    }
    
    // 刪除三級(jí)分類(lèi)保留第一個(gè)
    var objthird=document.getElementById("thirdlevel");
    for(var i=objthird.options.length-1;i>0;i--){
    objthird.options.remove(i);
    }
    
    $.ajax({
    type:"get",
    dataType:"text",
    url:"GetItemAction?itemlevel=2&itemcode="+itemcode,
     success:function(data){
     // 由JSON字符串轉(zhuǎn)換為JSON對(duì)象
     var objJSON=eval("("+data+")");
     var len=objJSON.itemInfo.length;
     var objSelect=document.getElementById("secondlevel");
     for(var i=0;i<len;i++){
     var op=new Option(objJSON.itemInfo[i].itemname,objJSON.itemInfo[i].itemcode);
     objSelect.add(op);
     } 
    
     },
    error: function (XMLHttpRequest, textStatus, errorThrown) { 
     alert(errorThrown); 
     }
    });
    }
    
    //顯示三級(jí)分類(lèi)
    function secondlevel_Click(){
    var objsecond=document.getElementById("secondlevel");
    var index=objsecond.selectedIndex; //選中索引 
    var itemcode=objsecond.options[index].value; //選中值
    if(itemcode==0){
    alert("請(qǐng)選擇事件類(lèi)別");
    return;
    }
    
    // 刪除三級(jí)分類(lèi)保留第一個(gè)
    var objthird=document.getElementById("thirdlevel");
    for(var i=objthird.options.length-1;i>0;i--){
    objthird.options.remove(i);
    }
    
    $.ajax({
    type:"get",
    dataType:"text",
    url:"GetItemAction?itemlevel=3&itemcode="+itemcode,
     success:function(data){
     // 由JSON字符串轉(zhuǎn)換為JSON對(duì)象
     var objJSON=eval("("+data+")");
     var len=objJSON.itemInfo.length;
     var objSelect=document.getElementById("thirdlevel");
     for(var i=0;i<len;i++){
     var op=new Option(objJSON.itemInfo[i].itemname,objJSON.itemInfo[i].itemcode);
     objSelect.add(op);
     } 
    
     },
    error: function (XMLHttpRequest, textStatus, errorThrown) { 
     alert(errorThrown); 
     }
    });
    }
    

    部分html代碼

    <table class="table-exposure">
     <tr>
     <td height="40">
     <select id="firstlevel" onchange="firstlevel_Click()" style="width:99%;font-size:1em;">
     <option value="0">請(qǐng)選擇事件大類(lèi)</option>
     </select> 
     </td>
     </tr>
     <tr>
     <td height="40">
     <select id="secondlevel" onchange="secondlevel_Click()" style="width:99%;font-size:1em;">
     <option value="0">請(qǐng)選擇事件小類(lèi)</option>
     </select>
     </td>
     </tr>
     <tr>
     <td height="40">
     <select id="thirdlevel" style="width:99%;font-size:1em;">
     <option value="0">請(qǐng)選擇事件類(lèi)別</option>
     </select>
     </td>
     </tr>
     </table>

    聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

    文檔

    ajax實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng)效果

    ajax實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng)效果:本文利用ajax技術(shù)從數(shù)據(jù)庫(kù)中獲取數(shù)據(jù),動(dòng)態(tài)實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng),效果圖如下: 前端js代碼如下: <script type=text/javascript src=jquery/jquery-1.9.1.min.js></script> <script type=tex
    推薦度:
    標(biāo)簽: 下拉框 select ajax
    • 熱門(mén)焦點(diǎn)

    最新推薦

    猜你喜歡

    熱門(mén)推薦

    專(zhuān)題
    Top
    主站蜘蛛池模板: 久久精品国产亚洲av瑜伽| 97久久精品人人澡人人爽| 91精品国产综合久久婷婷| 久久精品国产欧美日韩| 精品久久一区二区三区| 日韩精品久久无码人妻中文字幕| 国产精品成人小电影在线观看 | 国产A∨免费精品视频| 国产精品无码无卡在线播放| 免费精品久久久久久中文字幕| 尤物国产在线精品福利一区| 国产乱码精品一品二品| 在线精品视频一区二区| 老年人精品视频在线| 国产高清在线精品一区小说 | 精品无码久久久久久尤物| 亚洲精品网站在线观看不卡无广告 | 亚洲av永久无码精品古装片| 日韩精品电影一区亚洲| 久久97久久97精品免视看| 刺激无码在线观看精品视频| 久久99热国产这有精品| 97久久国产亚洲精品超碰热| 国产午夜福利精品一区二区三区| 亚洲精品午夜国产VA久久成人| 色偷偷88欧美精品久久久| 欧美精品亚洲人成在线观看| 久久精品国产一区二区| 久久久久久无码国产精品中文字幕 | 无码精品前田一区二区| 精品久久久久久国产三级| 国产精品免费久久久久影院| 隔壁老王国产在线精品| 国产精品1024在线永久免费| 国产精品高清在线| 囯产精品一区二区三区线| 国产精品麻豆VA在线播放| 国产成人精品大尺度在线观看| 国产精品一区12p| 国内精品久久久久国产盗摄| 久久免费国产精品|