เมนูแบบเลื่อนลงที่ใช้ bootstrap สามารถใช้งานได้ตามปกติในเบราว์เซอร์คอมพิวเตอร์ รายการดรอปดาวน์สามารถปรากฏขึ้นในเบราว์เซอร์มือถือ แต่ไม่สามารถเลือกรายการเมนูในรายการได้ คุณสามารถแทนที่ ontouchstart ในไฟล์สคริปต์ bootstrap ด้วย disable-ontouchstart แต่ไม่สามารถแก้ไขได้หลังจากการเปลี่ยน (โทรศัพท์มือถือ Redmi เบราว์เซอร์ UC ไม่รองรับโทรศัพท์มือถือ Xiaomi เบราว์เซอร์ UC เป็นเรื่องปกติและอื่น ๆ ยังไม่ได้รับการทดสอบในขณะนี้)
jQuery: v1.11.2
bootstrap: v3.3.4
ต่อไปนี้เป็นรหัสหน้าแผนกต้อนรับ:
<div> <span id = "Sizing-Addon2"> สวัสดิการท้องถิ่นดั้งเดิม: </span> <div> <button type = "ปุ่ม" id = "btnfuli" name = "btnfuli" data-toggle = "dropdown" value = "" aria-expeded = "false" title = '1' href = '#'> สวัสดิการท้องถิ่น </a> </li> <li class = 'divider'> </li> <li> <a title = '2' href = '#'> นอกสวัสดิการ </a> </li> <li> <li class = 'divider'> </li>
ต่อไปนี้คือสคริปต์ JS: (เพิ่มคลิกไปที่รายการเมนูแบบเลื่อนลง)
databindfuli: function () {$ ("#uifuli li a"). bind ("คลิก", function () {var $ this = $ (this); var $ a = $ this.parent (). parent (). prev () var t = $ this.text (); $ a.val ($ this.attr ('title')); $ ('#txtfuli'). val ($ this.attr ('title')); $ a.Text ($ this.Text ()); $ A.Append ("<span class = 'caret'>");});};การแก้ปัญหามีดังนี้:
เบราว์เซอร์มือถือไม่รองรับรหัสต่อไปนี้ กำหนดองค์ประกอบต่อไปนี้เพื่อระบุ ID เพื่อแก้ปัญหา ()
$ this.parent (). parent (). prev ()
รหัสที่ปรับแล้ว:
$ ("#drpworktype li a"). bind ("คลิก", function () {var $ this = $ (this); // var $ a = $ this.parent (). parent (). prev () $ ('#txtworktype'). val ($ this.attr ('title')); $ ('#btnworktype'). val ($ this.attr ('title'));ข้างต้นคือเหตุผลที่ไม่สามารถเลือกเมนูแบบเลื่อนลงบนโทรศัพท์มือถือของโทรศัพท์มือถือตามการใช้งาน bootstrap ฉันหวังว่ามันจะเป็นประโยชน์กับทุกคน หากคุณมีคำถามใด ๆ โปรดฝากข้อความถึงฉันและบรรณาธิการจะตอบกลับทุกคนในเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Wulin.com!