Pentru că a fost prima dată când am făcut acest efect, l-am făcut încet și am descoperit că am scris mult cod repetitiv.
Nu mai este timp să optimizăm acum, hai să ne mulțumim cu asta și, în final, să atașezăm pachetul comprimat, inclusiv scriptul din baza de date.
În plus, codul de legătură provincial și municipal scris în js pur este atașat
- <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PlaceInfo.aspx.cs" Inherits="AjaxDemo.PlaceInfo" %>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head runat="server">
- <title></title>
- <scrip去掉t src="scrip去掉ts/jquery-1.4.1.min.js" type="text/javascrip去掉t"></scrip去掉t>
- <scrip去掉t type="text/javascrip去掉t">
- //省方法
- function sheng() {
- var $sheng = $("#sheng option:selected").val();
- $.ajax({
- url: "ajax3.aspx",
- type: "get",
- data: "test=x&sheng=" + $sheng,
- success: function (mesg) {
- $("#shi").empty();
- $("#shi").append(mesg);
- $("#shi option:eq(0)").attr("selected", "selected");
- var num = $("#shi option").length;
- if (num > 1) {
- $("#shi").show();
- } else {
- $("#shi").hide();
- }
- shi();
- }
- });
- };
- //市方法
- function shi() {
- var $shi = $("#shi option:selected").val();
- $.ajax({
- url: "ajax3.aspx",
- type: "get",
- data: "test=x&sheng=" + $shi,
- success: function (mesg) {
- $("#xian").empty();
- $("#xian").append(mesg);
- $("#xian option:eq(0)").attr("selected", "selected");
- }
- });
- }
- $(function () {
- $.ajax({
- url: "ajax3.aspx",
- type: "get",
- data: "",
- success: function (mesg) {
- $("#sheng").append(mesg);
- $("#sheng option:eq(0)").attr("selected", "selected");
- sheng();
-
- }
- });
- /**测试按钮**/
- $(":button").click(function () {
- var $a = $("#sheng option:selected").val();
- alert($a);
- });
- //选中省
- $("#sheng").change(function () {
- sheng();
- });
- //选中市
- $("#shi").change(function () {
- shi();
- });
- });
- </scrip去掉t>
- </head>
- <body>
- <form id="form1" runat="server">
- <div>
- <select id="sheng"></select>
- <select id="shi"></select>
- <select id="xian"></select>
- <input type="button" value="test" />
- </div>
- </form>
- </body>
- </html>
Cod de copiere
AjaxDemo.rar
(196.62 KB, Numărul de descărcări: 4)
|