landaiqing/HTML
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

格式化代码

Browse Source
This commit is contained in:
landaiqing
2023-05-01 22:22:17 +08:00
parent 5ea2a40ec4
commit 295f24b49b
4 changed files with 148 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/index.html
View File

@@ -1,14 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<link href="./css/index.css" rel="stylesheet" type="text/css"/>
<link href="./css/index.css" rel="stylesheet" type="text/css" />
<script src="./js/index.js"></script>
<title>基于jQuery的AJAX实现三级联动菜单</title>
</head>
<body>
<div>
<form>
@@ -26,24 +28,25 @@
</div>
</body>
<script>
$(function(){
$(function () {
getCountry();
$("#province").change(function(){
CountryId=$("#province").val();
$("#province").change(function () {
CountryId = $("#province").val();
// console.log(FatherId);
getCity(CountryId);
CityID=$("#city").val();
CityID = $("#city").val();
// console.log(CityID);
getArea(CityID);
});
$("#city").change(function(){
CityID=$("#city").val();
$("#city").change(function () {
CityID = $("#city").val();
// console.log(CityID);
getArea(CityID);
})
})
</script>
</html>

88
Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/js/index.js
View File

@@ -1,69 +1,57 @@
function getData(){
function getData() {
$.ajax({
url : './json/third-level-address.json',
type : 'get',
url: './json/third-level-address.json',
type: 'get',
async: false,
success : function(data) {
if(data=="error"){
alert("系统错误");
return;
success: function (data) {
if (data == "error") {
alert("系统错误");
return;
}
dataJson = data;
}
dataJson=data;
}
});
return dataJson;
}
function getCountry(){
var data = getData();
var country = new Array();
var children = new Array();
var countryCode=new Array();
$.each(data,function(i,tmp){
countryCode.push(tmp.code);
country.push(tmp.name);
children.push(tmp.children);
});
// for(var i in data){
// console.log(data[i].children[0].children.length);
// }
var options = "<option value='0'>--请选择--</option>";
for(var i in data){
options += "<option value='" + data[i].code + "' selected>" + dataJson[i].name+"</option>";
$("#province").html(options);
// console.log(data[i].code);
}
}
function getCountry() {
var data = getData();
var options = "<option value='0'>--请选择--</option>";
for (var i in data) {
options += "<option value='" + data[i].code + "' selected>" + data[i].name + "</option>";
$("#province").html(options);
}
}
function getCity(countryCode){
function getCity(countryCode) {
var data = getData();
$('#city').empty();
var options = "<option value='0'>--请选择--</option>";
for(var i in data){
for(let j=0;j<data[i].children.length;j++){
if(countryCode && countryCode == data[i].code){
options += "<option value='" + data[i].children[j].code + "' selected>" + data[i].children[j].name+"</option>";
}
}
$("#city").html(options);
}
for (var i in data) {
for (let j = 0; j < data[i].children.length; j++) {
if (countryCode && countryCode == data[i].code) {
options += "<option value='" + data[i].children[j].code + "' selected>" + data[i].children[j].name + "</option>";
}
}
$("#city").html(options);
}
}
function getArea(cityCode){
function getArea(cityCode) {
var data = getData();
var options = "<option value='0'>--请选择--</option>";
for(var i in data){
for(let j=0;j<data[i].children.length;j++){
for(let k=0;k<data[i].children[j].children.length;k++){
if(cityCode && cityCode == data[i].children[j].code){
options += "<option value='" + data[i].children[j].children[k].code + "' selected>" + data[i].children[j].children[k].name+"</option>";
for (var i in data) {
for (let j = 0; j < data[i].children.length; j++) {
for (let k = 0; k < data[i].children[j].children.length; k++) {
if (cityCode && cityCode == data[i].children[j].code) {
options += "<option value='" + data[i].children[j].children[k].code + "' selected>" + data[i].children[j].children[k].name + "</option>";
}
}
}
}
}
$("#area").html(options);
}
}