jQuery PHP MySQL pautan sekunder menu lungsur contoh explanation_jquery

Pemilihan menu lungsur turun pautan peringkat kedua digunakan di banyak tempat, seperti pautan lungsur wilayah dan bandar serta pautan pilihan lungsur saiz produk. Artikel ini akan menerangkan melalui contoh cara menggunakan jQuery PHP MySQL untuk mencapai kesan pautan juntai bawah sekunder bagi klasifikasi saiz.
Kesan pelaksanaan: Apabila kategori utama dipilih, pilihan dalam kotak lungsur subkategori turut berubah.

Prinsip pelaksanaan: Mengikut nilai kategori utama, nilai dihantar ke PHP latar belakang untuk diproses melalui jQuery PHP membuat pertanyaan kepada pangkalan data MySQl untuk mendapatkan kecil yang sepadan kategori dan mengembalikan data JSON Untuk pemprosesan bahagian hadapan.
XHTML
Mula-mula kita perlu mencipta dua kotak pilihan juntai bawah, yang pertama ialah kategori utama dan yang kedua ialah kategori kecil. Nilai-nilai kategori utama boleh ditulis terlebih dahulu atau dibaca daripada pangkalan data.

<label>大类：</label> 
<select name="bigname" id="bigname"> 
  <option value="1">前端技术</option> 
  <option value="2">程序开发</option> 
  <option value="3">数据库</option> 
</select> 
<label>小类：</label> 
<select name="smallname" id="smallname"> 
<option value="1">flash</option> 
<option value="2">ps</option> 
</select> 

jQuery
Mula-mula tulis fungsi untuk mendapatkan nilai kotak pemilihan kategori besar, hantarkannya ke pelayan bahagian belakang.php melalui kaedah $.getJSON, baca data JSON yang dikembalikan oleh bahagian belakang dan lalui data JSON melalui kaedah $.setiap untuk menulis nilai yang sepadan Satu rentetan pilihan, dan akhirnya menambah pilihan kepada subkelas.

function getSelectVal(){ 
  $.getJSON("server.php",{bigname:$("#bigname").val()},function(json){ 
    var smallname = $("#smallname"); 
    $("option",smallname).remove(); //清空原有的选项 
    $.each(json,function(index,array){ 
      var option = "<option value='"+array['id']+"'>"+array['title']+"</option>"; 
      smallname.append(option); 
    }); 
  }); 
} 

Perhatikan bahawa sebelum melintasi dan menambahkan data JSON, anda mesti mengosongkan item asal dalam subkategori terlebih dahulu. Terdapat dua cara untuk mengosongkan pilihan, satu disebut dalam kod di atas, dan terdapat kaedah yang lebih mudah dan lebih langsung:

smallname.(); 

Kemudian, laksanakan fungsi panggilan selepas halaman dimuatkan:

$(function(){ 
  getSelectVal(); 
  $("#bigname").change(function(){ 
    getSelectVal(); 
  }); 
}); 

Apabila halaman dimulakan, kotak lungsur perlu menetapkan pilihan, jadi getSelectVal() dipanggil pada peringkat awal, dan apabila pilihan kategori utama berubah, getSelectVal() turut dipanggil.
PHP

include_once("connect.php"); //链接数据库 
 
$bigid = $_GET["bigname"]; 
if(isset($bigid)){ 
  $q=mysql_query("select * from catalog where cid = $bigid"); 
  while($row=mysql_fetch_array($q)){ 
    $select[] = array("id"=>$row[id],"title"=>$row[title]); 
  } 
  echo json_encode($select); 
} 

Bina pernyataan SQL untuk menanyakan jadual klasifikasi berdasarkan nilai kategori utama yang diluluskan oleh jQuery, dan akhirnya mengeluarkan data JSON. Tanpa arahan khas, sambungan PHP dan MySQL serta pernyataan pertanyaan yang digunakan oleh tapak ini semuanya menggunakan kaedah pernyataan asal seperti mysql_query, dll. Tujuannya adalah untuk membolehkan pembaca mengetahui pertanyaan penghantaran data secara intuitif.
Akhir sekali, lampirkan struktur jadual MYSQL:

CREATE TABLE `catalog` ( 
 `id` mediumint(6) NOT NULL auto_increment, 
 `cid` mediumint(6) NOT NULL default '0', 
 `title` varchar(50) NOT NULL, 
 PRIMARY KEY (`id`) 
) ENGINE=MyISAM DEFAULT CHARSET=utf8; 

Di atas adalah pengenalan kepada cara melaksanakan menu lungsur pautan kedua dengan menggabungkan jQuery, PHP, dan MySQL Program ini masih mempunyai beberapa kekurangan dan saya harap artikel ini dapat memberi anda sedikit inspirasi.