ตรวจสอบโดยใช้ jQuery หากองค์ประกอบคือ 'display: none' หรือบล็อกเมื่อคลิก

ฉันต้องการตรวจสอบและจัดเรียงองค์ประกอบที่ซ่อนอยู่ เป็นไปได้หรือไม่ที่จะหาองค์ประกอบทั้งหมดที่มีคุณลักษณะdisplayและความคุ้มค่าnone?

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

hiddenElements = $(':hidden');
visibleElements = $(':visible');

เพื่อตรวจสอบองค์ประกอบเฉพาะ

if($('#yourID:visible').length == 0)
{

}

องค์ประกอบจะถูกมองเห็นหากใช้พื้นที่ในเอกสาร องค์ประกอบที่มองเห็นได้มีความกว้างหรือความสูงที่มากกว่าศูนย์ อ้างอิง

นอกจากนี้คุณยังสามารถใช้is ()ด้วย:visible

if(!$('#yourID').is(':visible'))
{

}

หากคุณต้องการตรวจสอบค่าการแสดงผลคุณสามารถใช้css ()

if($('#yourID').css('display') == 'none')
{

}

หากคุณใช้แสดงค่าต่อไปนี้displayสามารถมีได้

แสดงผล: ไม่มี

จอแสดงผล: อินไลน์

จอแสดงผล: บล็อก

display: list-item

จอแสดงผล: บล็อกแบบอินไลน์

ตรวจสอบรายชื่อที่สมบูรณ์ของการที่เป็นไปได้displayค่าที่นี่

เพื่อตรวจสอบคุณสมบัติการแสดงผลด้วย JavaScript

var isVisible = document.getElementById("yourID").style.display == "block";
var isHidden = document.getElementById("yourID").style.display == "none"; 

$("element").filter(function() { return $(this).css("display") == "none" });

ใช่คุณสามารถใช้ cssfunction ได้ ด้านล่างจะค้นหา div ทั้งหมด แต่คุณสามารถแก้ไขได้ตามองค์ประกอบที่คุณต้องการ

$('div').each(function(){

    if ( $(this).css('display') == 'none')
    {
       //do something
    }
});

ใช้เงื่อนไขนี้:

if (jQuery(".profile-page-cont").css('display') == 'block'){
    // Condition 
}

มีสองวิธีใน jQuery เพื่อตรวจสอบการมองเห็น:

$("#selector").is(":visible")

และ

$("#selector").is(":hidden")

คุณยังสามารถรันคำสั่งตามการมองเห็นได้ในตัวเลือก

$("#selector:visible").hide()

หรือ

$("#selector:hidden").show()

$('#selector').is(':visible');