Rumah > Artikel > pembangunan bahagian belakang > Bagaimana untuk Mengemas kini Pilihan Dropdown Secara Automatik Berdasarkan Pemilihan Dropdown Pertama Tanpa Pangkalan Data?
Cara Mengemas kini Pilihan Secara Automatik dalam Dropdown Kedua Berdasarkan Pemilihan dalam Dropdown Pertama Tanpa Menggunakan Pangkalan Data
Anda mempunyai dua dropdown di mana pilihan tidak diambil daripada pangkalan data. Jatuh turun pertama membolehkan pengguna memilih kategori. Pilihan dalam dropdown kedua bergantung pada pilihan dalam dropdown pertama.
Contohnya, jika pengguna memilih pilihan First dalam dropdown pertama, dropdown kedua harus memaparkan pilihan Telefon Pintar dan Pengecas. Jika pengguna menukar pilihan mereka kepada pilihan Kedua, lungsur kedua kini akan memaparkan pilihan Bola Keranjang dan Bola Tampar.
Pelaksanaan tanpa Menggunakan Pangkalan Data
<select name="category" onchange="changeSecondDropdown(this)"></p> <pre class="brush:php;toolbar:false"><option value="0">None</option> <option value="1">First</option> <option value="2">Second</option>
<script><br>fungsi changeSecond Dropdown(kategori) {<br> const pilihan = {</p>
<pre class="brush:php;toolbar:false">"1": ["Smartphone", "Charger"],
"2": ["Basketball", "Volleyball"]</pre>
<p>};</p>
<p>// Kosongkan pilihan dalam dropdown kedua<br> const itemsDropdown = document.getElementById("items");<br> itemsDropdown.innerHTML = "";</p>
<p>// Tambah pilihan baharu berdasarkan kategori yang dipilih<br> const selectedOptions = options[category.value];<br> for (const option of selectedOptions) {</p>
<pre class="brush:php;toolbar:false">const newOption = document.createElement("option");
newOption.value = option;
newOption.textContent = option;
itemsDropdown.appendChild(newOption);</pre> <p>}<br>}<br></script>
Pelaksanaan ini menggunakan objek JavaScript untuk menyimpan pilihan bagi setiap kategori. Apabila pengguna menukar pilihan dalam lungsur turun pertama, fungsi changeSecondDropdown dipanggil, yang mengemas kini pilihan dalam lungsur kedua berdasarkan kategori yang dipilih.
Atas ialah kandungan terperinci Bagaimana untuk Mengemas kini Pilihan Dropdown Secara Automatik Berdasarkan Pemilihan Dropdown Pertama Tanpa Pangkalan Data?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!