亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

Jquery 三級聯動

標簽:
JQuery

 

<script type="text/javascript">         $(function(){              linkage.init('state','country','city');              linkage.init('state1','country1','city1');          });      </script>   </head>       <body >     出发地:      <select id="state"></select>&nbsp;      <select id="country"></select>&nbsp;      <select id="city"></select>     <br>     到达地:      <select id="state1"></select>&nbsp;      <select id="country1"></select>&nbsp;      <select id="city1"></select>   </body>


 

 

function linkage(){}   $(function(){      //linkage.init("state","country","city");  });    linkage.init = function(levelOne, levelTwo, levelThree){       linkage.data = [];       levelOne = "#" + levelOne;      levelTwo = "#" + levelTwo;      levelThree = "#" + levelThree;      var html = "";      var url = "linkage.action";//访问地址            //JQuery访问数据      $.getJSON(url, function(data){          linkage.data = data;                    $(levelOne).html(linkage.getOptionHtmlByLevel(1));//洲区域信息          $(levelTwo).html(linkage.getOptionHtmlById($(levelOne).val()));//国家信息          $(levelThree).html(linkage.getOptionHtmlById($(levelTwo).val()));//城市信息                    // 为下拉levelOne框绑定onchange事件          $(levelOne).change(function(){              $(levelTwo).html(linkage.getOptionHtmlById($(levelOne).val()));//国家信息              $(levelThree).html(linkage.getOptionHtmlById($(levelTwo).val()));//城市信息          });          // 为下拉levelTwo框绑定onchange事件          $(levelTwo).change(function(){              $(levelThree).html(linkage.getOptionHtmlById($(levelTwo).val()));//城市信息          });                });  };   /**   * 获得下拉框的选项html   * @param data    * @return html   */ linkage.getOptionHtml = function(data){      var html = "";            html = "<option value="+data.id+">" + data.locationName + "</option>";            return html;  };   /**   * 根据副ID查找数据   * @param subId    * @return html   */ linkage.getOptionHtmlById = function(subId){      var html = "";      for(i = 0 ; i < linkage.data.length ; i++){          if(linkage.data[i].subId == subId){              html += linkage.getOptionHtml(linkage.data[i]);          }      }            return html;  };   /**   * 根据区域级别查找数据   * @param level   * @return html   */ linkage.getOptionHtmlByLevel = function(level){      var html = "";            for(i = 0 ; i < linkage.data.length ; i++){          if(linkage.data[i].locationLevel == level){              html += linkage.getOptionHtml(linkage.data[i]);          }      }            return html;  };

 

public void getAllLocationInfo(){                    List<LocationBean> locationList = this.linkageService.findAllLocation();                                        HttpServletResponse response = (HttpServletResponse)ActionContext.getContext().get(ServletActionContext.HTTP_RESPONSE);          HttpServletRequest request = (HttpServletRequest)ActionContext.getContext().get(ServletActionContext.HTTP_REQUEST);          try {                            request.setCharacterEncoding("utf-8");              response.setCharacterEncoding("utf-8");              JSONArray json = JSONArray.fromObject(locationList);              response.getWriter().write(json.toString());          } catch (IOException e) {              // TODO Auto-generated catch block              e.printStackTrace();          }      }


 

注意:此用到了JSON转换包

 jar包:json-lib-0.4.jar,commons-beanutils.jar

點擊查看更多內容
TA 點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
  • 推薦
  • 評論
  • 收藏
  • 共同學習,寫下你的評論
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消