ใช้เค้าโครง bootstrap เพื่อเพิ่มไอคอน CLICK CLICK หนึ่งคลิกในกล่องอินพุตอินพุตเช่นไอคอน CLICK CLICK ONE CLICK ในกล่องอินพุตชื่อเข้าสู่ระบบและไอคอนตาขนาดเล็กที่แสดงรหัสผ่านในกล่องป้อนรหัสผ่านดังแสดงในรูปด้านล่าง:
อย่างไรก็ตามเมื่อใส่ไอคอนลงในกล่องอินพุตไอคอนไอคอนขนาดเล็กเหล่านี้ไม่สามารถรับเหตุการณ์คลิกได้
ดังนั้นคำถามคือ ไอคอนเล็ก ๆ เหล่านี้จะได้รับเหตุการณ์คลิกได้อย่างไร
ฉันไม่รู้ แต่ฉันสามารถใช้ วิธีวงเวียนในการใช้ฟังก์ชั่นนี้ทางอ้อม
*** ประเด็นสำคัญคือ:
วิธีแก้ปัญหา: เพิ่มองค์ประกอบที่มองไม่เห็นในตำแหน่งของไอคอนขนาดเล็กและขนาดขององค์ประกอบเพียงครอบคลุมไอคอนขนาดเล็ก แต่ไม่มีสีพื้นหลังและเส้นขอบ; มันเทียบเท่ากับการครอบคลุมไอคอนขนาดเล็กด้วยผ้าห่มโปร่งใส
คัดลอกรหัสดังนี้: <div>
<span> <i> </i> </span>
<input type = "text" placeolder = "บัญชี/หมายเลขมือถือ/อีเมล" id = "ชื่อผู้ใช้">
<span style = "display: inline-block;"> </span> <-องค์ประกอบไอคอนขนาดเล็ก->
<span style = "จอแสดงผล: inline-block; ขอบ: 1px ของแข็งสีแดง; ความกว้าง: 30px; ความสูง: 30px; ตำแหน่ง: สัมบูรณ์; ขวา: 2px; z-index: 100; เคอร์เซอร์: ตัวชี้;"> </span> <-องค์ประกอบเหนือไอคอนขนาดเล็ก->>
</div>
เพิ่มเหตุการณ์ในองค์ประกอบนี้ที่ซ้อนทับบนไอคอนขนาดเล็ก ฟังก์ชั่นของไอคอนขนาดเล็กเป็นเพียงการแสดงและซ่อนตามต้องการ
นี่คือการรับรู้ทางอ้อม เอฟเฟกต์การคลิกของไอคอนขนาดเล็กเป็นทางออกที่ดีหรือไม่? ขอบคุณสำหรับการอ่านของคุณและฉันหวังว่ามันจะช่วยให้คุณแก้ปัญหาได้อย่างราบรื่น
หากคุณยังต้องการเรียนรู้อย่างลึก