A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 赵刘滨 中级黑马   /  2012-8-6 16:19  /  2470 人查看  /  2 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

用jquery怎么样实现省市县三级联动?要代码的,详细点谢谢。

2 个回复

倒序浏览
本帖最后由 樊占江 于 2012-8-6 19:52 编辑

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">   
    <title>省市区三级联动下拉菜单</title>
    <script type="text/javascript" src="<%=path %>/js/jquery/jquery-1.7.min.js"></script>
    <script type="text/javascript" src="<%=path %>/js/json/json-minified.js"></script>
  </head>
  
  <body>
  <table>
  <tr>
  <td>
  省份:
    <select name="province" id="province"></select>
  城市:
  <select name="city" id="city">
      <option value="">请选择</option>
  </select>
  区(县):
  <select name="district" id="district">
      <option value="">请选择</option>
  </select>
  </td>
  </tr>
  </table>
  </body>
</html>
<script type="text/javascript">

function onSelectChange(obj,toSelId){
    setSelect(obj.value,toSelId);
}


function setSelect(fromSelVal,toSelId){
    //alert(document.getElementById("province").selectedIndex);
    document.getElementById(toSelId).innerHTML="";
    jQuery.ajax({
      url: "<%=path%>/getDropdownDataServlet",
      cache: false,
      data:"parentId="+fromSelVal,
      success: function(data){
        createSelectObj(data,toSelId);
      }
    });
}

function createSelectObj(data,toSelId){
    var arr = jsonParse(data);
    if(arr != null && arr.length>0){
        var obj = document.getElementById(toSelId);
        obj.innerHTML="";
        var nullOp = document.createElement("option");
        nullOp.setAttribute("value","");
        nullOp.appendChild(document.createTextNode("请选择"));
        obj.appendChild(nullOp);
        for(var o in arr){
            var op = document.createElement("option");
            op.setAttribute("value",arr[o].id);
            //op.text=arr[o].name;//这一句在ie下不起作用,用下面这一句或者innerHTML
            op.appendChild(document.createTextNode(arr[o].name));
            obj.appendChild(op);
        }
        
    }
}

setSelect('1','province');
</script>

是不是你想要的啊?  我主要学的是java,所以只能给你jsp的代码,如果你能看懂java代码的话,我给你Class

评分

参与人数 1黑马币 +2 收起 理由
赵刘滨 + 2 赞一个!

查看全部评分

回复 使用道具 举报
樊占江 发表于 2012-8-6 19:50
省市区三级联动下拉菜单
   
   

谢谢,我先看看这个。javas的我看不懂
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马