Cet article est un article miroir de traduction automatique, veuillez cliquer ici pour accéder à l’article original.

Architect_Programmer_Code Réseau agricole»Architecte › Conception front-end & web › Cadre frontal › Jquery utilise la base de données de requêtes AJAX pour la liaison entre provinces et municipalités
Vue: 17984|Répondre: 3

[Jquery] Jquery utilise la base de données de requêtes AJAX pour la liaison entre provinces et municipalités

[Copié le lien]
Publié sur 19/08/2015 21:09:49 | | |
Comme c’était la première fois que je faisais cet effet, je l’ai fait lentement et j’ai découvert que j’avais écrit beaucoup de code répétitif.

Il n’y a pas le temps d’optimiser maintenant, faisons avec, et enfin attachons le package compressé, y compris le script de la base de données.

De plus, le code de liaison provincial et municipal écrit en js pur est joint

Utilisez JS pour réaliser le menu de liaison à trois niveaux des provinces et villes
http://www.itsvse.com/thread-2072-1-1.html
(Source : Collège professionnel d’ingénierie logicielle de Wuhan)


  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PlaceInfo.aspx.cs" Inherits="AjaxDemo.PlaceInfo" %>

  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7.     <title></title>
  8.     <scrip去掉t src="scrip去掉ts/jquery-1.4.1.min.js" type="text/javascrip去掉t"></scrip去掉t>
  9.     <scrip去掉t type="text/javascrip去掉t">

  11.         //省方法
  12.         function sheng() {
  13.             var $sheng = $("#sheng option:selected").val();
  14.             $.ajax({
  15.                 url: "ajax3.aspx",
  16.                 type: "get",
  17.                 data: "test=x&sheng=" + $sheng,
  18.                 success: function (mesg) {
  19.                     $("#shi").empty();
  20.                     $("#shi").append(mesg);
  21.                     $("#shi option:eq(0)").attr("selected", "selected");
  22.                     var num = $("#shi option").length;
  23.                     if (num > 1) {
  24.                         $("#shi").show();
  25.                     } else {
  26.                         $("#shi").hide();
  27.                     }
  28.                     shi();
  29.                 }
  30.             });
  31.         };
  32.         //市方法
  33.         function shi() {
  34.             var $shi = $("#shi option:selected").val();
  35.             $.ajax({
  36.                 url: "ajax3.aspx",
  37.                 type: "get",
  38.                 data: "test=x&sheng=" + $shi,
  39.                 success: function (mesg) {
  40.                     $("#xian").empty();
  41.                     $("#xian").append(mesg);
  42.                     $("#xian option:eq(0)").attr("selected", "selected");
  43.                 }
  44.             });
  45.         }
  46.         $(function () {

  48.             $.ajax({
  49.                 url: "ajax3.aspx",
  50.                 type: "get",
  51.                 data: "",
  52.                 success: function (mesg) {
  53.                     $("#sheng").append(mesg);
  54.                     $("#sheng option:eq(0)").attr("selected", "selected");
  55.                     sheng();
  56.                     
  57.                 }
  58.             });
  59.             /**测试按钮**/
  60.             $(":button").click(function () {
  61.                 var $a = $("#sheng option:selected").val();
  62.                 alert($a);
  63.             });
  64.             //选中省
  65.             $("#sheng").change(function () {
  66.                 sheng();
  67.             });
  68.             //选中市
  69.             $("#shi").change(function () {
  70.                 shi();
  71.             });
  72.         });
  73.     </scrip去掉t>
  74. </head>
  75. <body>
  76.     <form id="form1" runat="server">
  77.     <div>
  78.         <select id="sheng"></select>
  79.         <select id="shi"></select>
  80.         <select id="xian"></select>
  81.         <input type="button" value="test" />   
  82.     </div>
  83.     </form>
  84. </body>
  85. </html>
Code de copie
AjaxDemo.rar (196.62 KB, Nombre de téléchargements: 4)




Précédent:Avertissement disque dur de l’ordinateur C5, que faire
Prochain:jquery plusieurs points de connaissance communs

Articles connexes
Publié sur 21/08/2015 21:44:21 |
Laisse-moi ajouter

SSLD.rar

185,49 Ko, Temps de téléchargement : 6, Crédits de téléchargement : -1 prestige, -1 contribution
Publié sur 22/08/2015 07:45:21 |
Delver_Si Publié le 21-08-2015 à 21:44
Laisse-moi ajouter

Très puissant !!
Publié sur 22/08/2015 17:55:02 |
admin publié le 2015-8-22 à 07:45
Très puissant !!

Démenti:
Tous les logiciels, supports de programmation ou articles publiés par Code Farmer Network sont uniquement destinés à l’apprentissage et à la recherche ; Le contenu ci-dessus ne doit pas être utilisé à des fins commerciales ou illégales, sinon les utilisateurs assumeront toutes les conséquences. Les informations sur ce site proviennent d’Internet, et les litiges de droits d’auteur n’ont rien à voir avec ce site. Vous devez supprimer complètement le contenu ci-dessus de votre ordinateur dans les 24 heures suivant le téléchargement. Si vous aimez le programme, merci de soutenir un logiciel authentique, d’acheter l’immatriculation et d’obtenir de meilleurs services authentiques. En cas d’infraction, veuillez nous contacter par e-mail.
Mail To:help@itsvse.com