天天看點

省市區三級關聯前端代碼

$(function() {
		//頁面初次加載時
		$.ajax({
			  type: "POST",
			  url: "${pageContext.request.contextPath}/findShengServlet?method=findSheng",
			  dataType: "json",
			  success: function(date) {
				 $(date).each(function() {
					 var s = "<option value='" + this.id + "'>" + this.name + "</option>";
					 $("#sheng").append($(s));
					 
				 });
			  }
		});
		//省改變時
		$("#sheng").change(function() {
			var value = $(this).prop("value");
			
			$.ajax({
				  type: "POST",
				  url: "${pageContext.request.contextPath}/findShengServlet?method=findShi",
				  data:{"value":value},
				  dataType: "json",
				  success: function(date) {
				     $("#shi").empty();
				     $("#shi").append($("<option value='-2'>請選擇/市</option>")); 
					 $(date).each(function() {
						 var s = "<option value='" + this.id + "'>" + this.name + "</option>";
						 $("#shi").append($(s));
						 
					 });
				  }
			});
			//省改變市縣必須改為空
			$("#xian").empty();
			$("#xian").append("<option value='-2'>請選擇/市</option>");
		});
		//市改變時
		$("#shi").change(function() {
			var value = $(this).prop("value");
			$.ajax({
				  type: "POST",
				  url: "${pageContext.request.contextPath}/findShengServlet?method=findXian",
				  data:{"value":value},
				  dataType: "json",
				  success: function(date) {
				     $("#xian").empty();
				     $("#xian").append($("<option value='-2'>請選擇/縣</option>")); 
					 $(date).each(function() {
						 var s = "<option value='" + this.id + "'>" + this.name + "</option>";
						 $("#xian").append($(s));
						 
					 });
				  }
			});
		});
		/* */
	})
           

繼續閱讀