ซ่อน / แสดงองค์ประกอบด้วยบูลีน

ฉันมักจะมีสิ่งเหล่านี้มากมายในรหัสของฉัน

if(shouldElementBeVisible)
    $element.show()
else
    $element.hide()

มีวิธีที่หรูหรากว่านี้ที่บรรจุด้วยจาวาสคริปต์ jquery หรือขีดล่างหรือไม่? ตามหลักการแล้วฉันต้องการอะไรที่มีลักษณะเช่นนี้

$element.showOrHideDependingOn(shouldElementBeVisible)

เห็นได้ชัดว่าคุณสามารถส่งผ่านบูลีนไปยังtoggleฟังก์ชันได้

$element.toggle(shouldElementBeVisible)

ใช่แล้ว!

$element.toggle();

ไม่มีพารามิเตอร์ใด ๆtoggleเพียงแค่สลับการเปิดเผยองค์ประกอบ (ฉันไม่ได้หมายถึงvisibilityคุณสมบัติ) และขึ้นอยู่กับสถานะปัจจุบันขององค์ประกอบ

$element.toggle(display);

หากคุณเรียกtoggleด้วยพารามิเตอร์บูลีนองค์ประกอบจะแสดงว่าเป็นtrueและhiddenถ้าเป็นfalse

แหล่งที่มา

jQuery มีtoggle: http://api.jquery.com/toggle/

$element.toggle();

สิ่งนี้จะแสดงองค์ประกอบหากถูกซ่อนและซ่อนไว้หากมีการแสดง

ฟังก์ชั่น.toggle()เปลี่ยนdisplayองค์ประกอบขององค์ประกอบ

หากคุณต้องการเปลี่ยนvisibilityฉันขอแนะนำให้ใช้?:โอเปอเรเตอร์แทน สำหรับสิ่งนี้ใน CSS ของคุณให้ตั้งค่าการเปิดเผยเป็นสถานะดั้งเดิมและใน JS เพียงแค่ใส่:

    var checkboxChecked = $("#yourCheckbox").(":checked");

    $("#yourElement").css("visibility", checkboxChecked ? "visible" : "hidden");