//页面部分代码
<div class="mui-input-row">
<label class="txt2">丢失地点</label>
<!-- 用于保存省份的name -->
<input type="hidden" id="liveProvinceBaseName" name=" ">
<select class="mui-inline mui-select" id="province" name=" " >
<option>省</option>
</select>
</div>
<div class="mui-input-row">
<label style="display: none;">Input</label>
<!-- 用于保存市区的name -->
<input type="hidden" id="liveCityBaseName" name=" ">
<select class="mui-inline mui-select" id="city" name=" ">
<option>市</option>
</select>
</div>
<div class="mui-input-row">
<label style="display: none;">Input</label>
<!-- 用于保存区县的name -->
<input type="hidden" id="liveDowntownBaseName" name=" ">
<select class="mui-inline mui-select" id="county" name=" ">
<option>区/县</option>
</select>
</div>
//js代码
$(document).ready(function(){
$.ajax({
type: "post",
dataType: "json",
url: " ",
success: function(data){
var result = "<option>选择省份</option>"
$.each(data, function(i, item) {
result +="<option value='"+item.proId+"'>"+item.proName+"</option>";
});
$("#province").html('');
$("#province").append(result);
}
});
$("#province").change(function () {
var selectedIndex = document.getElementById("province").selectedIndex;
$("#liveProvinceBaseName").val(document.getElementById("province").options[selectedIndex].text);
$.ajax({
type: "post",
dataType: "json",
url: " ",
data: {provinceid:$("#province").val()},
success: function(data){
var result = "<option>选择城市</option>"
$.each(data, function(i, item) {
result +="<option value='"+item.cityId+"'>"+item.cityName+"</option>";
});
$("#city").html(' ');
$("#city").append(result);
var result1 = "<option>选择区域</option>";
$("#county").html(' ');
$("#county").append(result1);
}
});
});
$("#city").change(function () {
var selectedIndex = document.getElementById("city").selectedIndex;
$("#liveCityBaseName").val(document.getElementById("city").options[selectedIndex].text);
$.ajax({
type: "get",
dataType:"json",
url: " ",
data: {cityid:$("#city").val()},
success: function(data){
var result = "<option>选择区域</option>";
$.each(data, function(i, item) {
result +="<option value='"+item.dtId+"'>"+item.downtownName+"</option>";
});
$("#county").html('');
$("#county").append(result);
}
});
});
$("#county").change(function () {
var selectedIndex = document.getElementById("county").selectedIndex;
$("#liveDowntownBaseName").val(document.getElementById("county").options[selectedIndex].text);
});
});