jQuery อัลกอริทึมส่วนผ่าน - toggle() วิธี

ตัวอย่าง

เปลี่ยนสถานะการแสดงและซ่อนของอิเลเมนต์ <p>

$(".btn1").click(function(){
  $("p").hide();
});

ลองด้วยตัวเอง

คำนิยามและวิธีใช้

toggle() วิธีกำหนดสถานะที่เห็นได้ของอิเลเมนต์

ถ้าอิเลเมนต์ที่เลือกเห็นได้ จะซ่อนอิเลเมนต์นั้น และถ้าอิเลเมนต์ที่เลือกซ่อน จะแสดงอิเลเมนต์นั้น

การใช้งาน

$(selector).toggle(speed,callback,switch)
ตัวแปร รายละเอียด
speed

ตัวเลือกได้. กำหนดความเร็วของอิเลเมนต์จากเห็นได้ถึงซ่อนไป (หรือกลับกัน) โดยเริ่มต้นเป็น "0"

ค่าที่เป็นไปได้

  • มิลลิเซ็กันด์ (เช่น 1500)
  • "slow"
  • "normal"
  • "fast"

ในขณะที่กำหนดความเร็ว อิเลเมนต์จะเปลี่ยนแปลงขนาด สูง กว้าง มุมบริเวณนอก และมุมบริเวณใน ระหว่างที่มันเปลี่ยนสถานะจากเห็นได้ถึงซ่อนไป

ถ้าตั้งค่าตัวแปรนี้ จะไม่สามารถใช้ตัวแปร switch

callback

ตัวเลือกได้. ฟังก์ชันที่ต้องการปฏิบัติหลังจากการปฏิบัติ toggle

หากต้องการเรียนรู้เกี่ยวกับ callback มากขึ้น โปรดเข้าชมบท jQuery Callback ของเรา

ไม่สามารถตั้งค่าตัวแปรนี้ได้ ยกเว้นที่ได้ตั้งค่าตัวแปร speed

switch

ตัวเลือกได้. ตัวเลขทึบ. กำหนดว่า toggle จะซ่อนหรือแสดงทุกอิเลเมนต์ที่ถูกเลือก

  • True - แสดงทุกอิเลเมนต์
  • False - ซ่อนทุกอิเลเมนต์

ถ้าตั้งค่าตัวแปรนี้ จะไม่สามารถใช้ตัวแปร speed และ callback

คำแนะนำและหมายเหตุ

หมายเหตุ:ผลลัพธ์นี้นั้นเหมาะกับอิเลเมนต์ที่ถูกซ่อนด้วย jQuery หรืออิเลเมนต์ที่ถูกกำหนด display:none ใน CSS (แต่ไม่เหมาะกับอิเลเมนต์ที่ถูกกำหนด visibility:hidden)

ตัวอย่างเพิ่มเติม

ใช้ตัวแปร speed
ใช้ตัวแปร speed ในการซ่อนและแสดงอิเลเมนต์
ใช้ตัวแปร switch
ใช้ตัวแปร switch ในการแสดงช่องว่างทั้งหมด