JQuery Kiểm tra để xem nếu Div được hiển thị

Question

Đây là những gì tôi đang cố gắng để cuối cùng đạt được:

//When the user clicks the liveshow button this happens 
    $(".liveshow-button").live('click', function() { 
     if ($(".liveshowDiv2").css('display') == 'none') { 
      $(".liveshowDiv2").fadeOut(ifadeOutSpeed, function() { 
       $('#wrapper-div').animate({ height: $('.liveshowDiv1').height() + "px" }, iresizeSpeed, function() { 
        $('.liveshowDiv1').fadeIn(ifadeInSpeed, function() { 
        }); 
       }); 
      }); 
     } 
     else { 
      alert('This never gets displayed'); 
      $(".liveshowDiv1").slideUp('fast'); 
     } 
    }); 

Về cơ bản tôi muốn chuyển đổi giữa liveShowDiv1 được hiển thị và ẩn khi bạn nhấp vào nút này. Nhưng vì những thứ khác trên trang có thể làm cho liveShowDiv1 bị ẩn, tôi không thể chỉ thực hiện chức năng chuyển đổi để thực hiện việc này. Tôi phải kiểm tra bằng cách nào đó để xem nếu liveShowDiv1 đang được hiển thị hay không.

Khi nó không được hiển thị: hiển thị = none

Khi nó được hiển thị màn hình không phải là trong thẻ style ở tất cả

Làm thế nào tôi có thể nói trong JQuery khi div này sẽ được hiển thị?

Answer 1

if ($(this).is(':visible')) nên hoạt động cho chương trình/ẩn tương đối đơn giản này.

Answer 2

Thỉnh thoảng, hãy kiểm tra xem div có bị chặn hay không. Chúng ta có thể làm điều này rất dễ dàng. Đây là mã đơn giản. đây id = "test" -> cho mục đích thử nghiệm nếu bạn sử dụng class = "test" sau đó cần phải cập nhật mã Đối với kiểm tra Chặn hoặc có thể nhìn thấy sau đó sử dụng này cho chọn test của bạn là id

1. if ($('#test').is(':visible')) {} 

2. if ($('#test').css('display') == 'block'){} 

3. if ($('#test').not(':hidden')){} 

nếu chọn của bạn là class sau đó

1. if ($('.test').is(':visible')) {} 

hoặc

1. if ($(your_element).is(':visible')) {} 

cùng một số khác

Đối với việc kiểm tra không có hoặc ẩn sau đó sử dụng đoạn mã này nếu selector của bạn là id

1. if ($('#test').not(':visible')){} 

2. if (!$('#test').is(':visible')){} 

3. if ($('#test').css('display') == 'none'){} 

4. if ($('#test').is(':hidden')){} 

nếu chọn của bạn là lớp sau đó sử dụng này

1. if ($('.test').not(':visible')){} 

hoặc

1. if ($(your_element).not(':visible')){} 

hy vọng nó sẽ giúp bạn

Answer 3

Bạn có thể thử điều này:

$(your_element).is(":visible") 

Ví dụ;

if ($('#element_id').is(":visible")) { 
    // do something 
} 

Answer 4

Bạn có thể sử dụng $(element).is(":visible") để kiểm tra xem phần tử có thể nhìn thấy