jQuery的ajax(get)省市联动
来源:互联网 发布:一路发微博营销软件 编辑:程序博客网 时间:2024/05/21 16:57
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function() {
$.get('${pageContext.request.contextPath }/sys/province.action',function(data){
var jsonObj = data;
var selectValue = document.getElementById("province");
selectValue.options.length = 0;
var Item = new Option("-省-", -1);
selectValue.add(Item);
$.each(jsonObj, function(i,j) {
var Item = new Option(j.province, j.id);
selectValue.options.add(Item);
});
selectValue = document.getElementById("city");
selectValue.options.length = 0;
var Item = new Option("-市-", -1);
selectValue.options.add(Item);
selectValue = document.getElementById("district");
selectValue.options.length = 0;
var Item = new Option("-区-", -1);
selectValue.options.add(Item);
selectValue = document.getElementById("shop");
selectValue.options.length = 0;
var Item = new Option("-店-", -1);
selectValue.options.add(Item);
});
$("#province").change(function() {
$.get('${pageContext.request.contextPath }/sys/city.action?id='+this.options[this.selectedIndex].value,
function(data){
var jsonObj = data;
selectValue = document.getElementById("city");
selectValue.options.length = 0;
var Item = new Option("-市-", -1);
selectValue.options.add(Item);
$.each(jsonObj, function(i,j) {
var Item = new Option(j.city, j.id);
selectValue.options.add(Item);
});
selectValue = document.getElementById("district");
selectValue.options.length = 0;
var Item = new Option("-区-", -1);
selectValue.options.add(Item);
selectValue = document.getElementById("shop");
selectValue.options.length = 0;
var Item = new Option("-店-", -1);
selectValue.options.add(Item);
});
});
$("#city").change(function() {
$.get('${pageContext.request.contextPath }/sys/area.action?id='+this.options[this.selectedIndex].value,
function(data){
var jsonObj = data;
selectValue = document.getElementById("district");
selectValue.options.length = 0;
var Item = new Option("-区-", -1);
selectValue.options.add(Item);
$.each(jsonObj, function(i,j) {
var Item = new Option(j.district, j.id);
selectValue.options.add(Item);
});
selectValue = document.getElementById("shop");
selectValue.options.length = 0;
var Item = new Option("-店-", -1);
selectValue.options.add(Item);
});
});
$("#district").change(function() {
$.get('${pageContext.request.contextPath }/shop/find.action?caddress='+this.options[this.selectedIndex].value,
function(data){
var jsonObj = data;
selectValue = document.getElementById("shop");
selectValue.options.length = 0;
var Item = new Option("-店-", -1);
selectValue.options.add(Item);
$.each(jsonObj, function(i,j) {
var Item = new Option(j.shopname, j.shopid);
selectValue.options.add(Item);
});
});
});
});
</script>
<select name="province" id="province" style="width:130px;">
<option value="-1">--请选择省--</option>
</select>
<select name="city" id="city" style="width:130px;">
<option value="-1">--请选择市--</option>
</select>
<select name="district" id="district" style="width:130px;">
<option value="-1">--请选择区--</option>
</select>
<select name="shopid" id="shop" style="width:130px;">
<option value="-1">--请选择店--</option>
</select>
0 0
- jQuery的ajax(get)省市联动
- jquery AJAX 省市联动
- jQuery的省市联动
- jquery+xml+ajax 省市多级联动
- jquery ajax实现省市二级联动
- jQuery ajax实现省市县三级联动
- jQuery省市的二级联动
- JQuery+Ajax实现下拉框联动(省市联动)
- js的ajax做的省市联动
- AJAX实现简单的省市二级联动
- 原生态ajax的省市联动
- 简单的两级联动ajax加载省市
- Ajax联动实现省市联动
- ajax pro省市联动
- ajax省市县联动
- AJAX实现省市联动
- 省市联动 ajax
- 省市联动ajax代码
- 斯坦福机器学习笔记十二
- 逆序输出字符串
- 445port入侵具体解释
- 基于socket网络编程的文件传输程序
- 深入java (类)初探类的加载和初始化顺序
- jQuery的ajax(get)省市联动
- Android之error: 'const struct JNINativeInterface' has no member named 'callVoidMethod'
- C/C++中的计时函数
- SVM中的Dual
- 用一个数组实现两个堆栈,最大地使用数组的空间,只要有空间就能入栈成功
- 简易扁平旅游网H5开源项目
- 使用Bochs运行程序
- hiho一下 第150周 Demo Day
- C++普通函数,普通成员函数、静态成员函数的区别