ฉันเป็นช่างเทคนิคที่มีส่วนร่วมในการพัฒนาส่วนหน้า กล่องดรอปดาวน์คือองค์ประกอบหน้าเว็บที่เราใช้มากขึ้น วันนี้ฉันจะพูดคุยเกี่ยวกับตัวอย่างบางส่วนของเหตุการณ์การลงทะเบียนกล่องแบบเลื่อนลงตามปัญหาที่พบในงานจริง ฉันหวังว่ามันจะเป็นประโยชน์กับทุกคน
การคัดลอกรหัสมีดังนี้:
<select name = "" id = "sel">
<ตัวเลือกค่า = "111"> 1 </potion>
<ตัวเลือกค่า = "222"> 2 </potion>
<ตัวเลือกค่า = "333"> 3 </potion>
</เลือก>
ด้านบนเป็นรหัสดรอปดาวน์แบบตัวเลือกเดียวที่ง่ายมาก หากเราต้องการรับค่าที่สอดคล้องกันโดยคลิกตัวเลือกแบบดรอปดาวน์รหัสทั่วไปมีดังนี้:
การคัดลอกรหัสมีดังนี้:
var sel = document.getElementById ("sel");
ตัวเลือก var = sel.options;
สำหรับ (var i = 0; i <option.length; i ++) {
ตัวเลือก [i] .onclick = function () {
การแจ้งเตือน (this.text); // รับค่าข้อความของตัวเลือกดรอปดาวน์
การแจ้งเตือน (this.value); // รับค่าของตัวเลือกดรอปดาวน์
-
-
รหัสข้างต้นไม่สามารถสร้างเอฟเฟกต์ที่คาดหวังได้ด้านล่าง IE9 และ Chrome และมีประสิทธิภาพใน Firefox ในกรณีนี้ไม่แนะนำให้ผูกเหตุการณ์คลิกบนตัวเลือกตัวเลือก ขอแนะนำให้ใช้เหตุการณ์การเปลี่ยนแปลงแทนเนื่องจากการเปลี่ยนแปลงเป็นเรื่องทั่วไปและเป็นหลักคือการเปลี่ยนแปลง
การคัดลอกรหัสมีดังนี้:
var sel = document.getElementById ("sel");
sel.onchange = function () {
การแจ้งเตือน (sel.options [sel.selectedIndex] .Value);
-
ข้างต้นเป็นเรื่องเกี่ยวกับบทความนี้ฉันหวังว่าคุณจะชอบมัน