Jquery 逆向三级联动

2023-06-15,,

 

  1. linkage.init = function(levelOne, levelTwo, levelThree){  
  2.  
  3.     linkage.data = [];  
  4.  
  5.     levelOne = "#" + levelOne;  
  6.     levelTwo = "#" + levelTwo;  
  7.     levelThree = "#" + levelThree;  
  8.     var html = "";  
  9.     var url = "linkage.action";//访问地址  
  10.       
  11.     //JQuery访问数据  
  12.     $.getJSON(url, function(data){  
  13.         linkage.data = data;  
  14.           
  15.         //--正向三级联动------------------  
  16.         /**  
  17.         $(levelOne).html(linkage.getOptionHtmlByLevel(1));//洲区域信息  
  18.         $(levelTwo).html(linkage.getOptionHtmlById($(levelOne).val()));//国家信息  
  19.         $(levelThree).html(linkage.getOptionHtmlById($(levelTwo).val()));//城市信息  
  20.           
  21.         // 为下拉levelOne框绑定onchange事件  
  22.         $(levelOne).change(function(){  
  23.             $(levelTwo).html(linkage.getOptionHtmlById($(levelOne).val()));//国家信息  
  24.             $(levelThree).html(linkage.getOptionHtmlById($(levelTwo).val()));//城市信息  
  25.         });  
  26.         // 为下拉levelTwo框绑定onchange事件  
  27.         $(levelTwo).change(function(){  
  28.             $(levelThree).html(linkage.getOptionHtmlById($(levelTwo).val()));//城市信息  
  29.         });  
  30.           
  31.         */ 
  32.         //--逆向三级联动------------------  
  33.         //初始化下拉框信息  
  34.         $(levelThree).html(linkage.getOptionHtmlByLevel(3));//洲区域信息  
  35.         $(levelTwo).html(linkage.getOptionHtmlByLevel(2));//国家信息  
  36.         //$(levelTwo).val(linkage.getSubIdById($(levelThree).val()));//所属国家信息  
  37.         $(levelOne).html(linkage.getOptionHtmlByLevel(1));//城市信息  
  38.         //$(levelOne).val(linkage.getSubIdById($(levelTwo).val()));//所属城市信息  
  39.           
  40.         // 为下拉levelOne框绑定onchange事件  
  41.         $(levelThree).change(function(){  
  42.             $(levelTwo).val(linkage.getSubIdById($(levelThree).val()));//所属国家信息  
  43.             $(levelOne).val(linkage.getSubIdById($(levelTwo).val()));//所属城市信息  
  44.         });  
  45.         // 为下拉levelTwo框绑定onchange事件  
  46.         $(levelTwo).change(function(){  
  47.             $(levelOne).val(linkage.getSubIdById($(levelTwo).val()));//所属城市信息  
  48.         });  
  49.     });  
  50. };  
  51.  
  52. //--逆向三级联动方法  
  53. linkage.getSubIdById = function(id){  
  54.       
  55.     for(i = 0 ; i < linkage.data.length ; i++){  
  56.         if(linkage.data[i].id == id){  
  57.             return linkage.data[i].subId;  
  58.         }  
  59.     }  
  60. }; 

 

《Jquery 逆向三级联动.doc》

下载本文的Word格式文档,以方便收藏与打印。