Как проверить видимость элемента jquery?

204
24 сентября 2018, 02:50

Привел тестовый пример с сайта для удобства. Вроде бы всё норм: нажатие на кнопку корзины и появление счетчика товаров. После перезагрузки страницы на сайте уже не будет ни кнопки, ни счётчика (т.к в css у счётчика товаров "num" display:none). Просьба помочь, как реализовать проверку условия: если виден элемент счётчик, то спрятать кнопку, иначе - показать кнопку добавления в корзину

$('.add2cart').click(function(e) { 
            e.preventDefault(); 
            $(this).hide(); 
            $(this).prev('.num').show(); 
 
});
.num { 
   display: none;  
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<input class="num" type="number" placeholder="кол-во"> 
<a class="add2cart" href=""> 
  <img src="https://d30y9cdsu7xlg0.cloudfront.net/png/38919-200.png" alt=""> 
</a>

Я попытался сделать такое условие:

if ( $( ".add2cart" ).length ) {
                $( ".num" ).show();
            } else {
                $( ".num" ).hide();
}
Answer 1

Если нужно убедиться, что у блока нет CSS свойства display:none, то подойдёт такой код:

$(function(){ 
  console.log($('.num').css('display')=='none'?'Да, он невидем!':'Блок видимый') 
 })
.num{ 
  display:none; 
 }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="num"></div>

Под вашу задачу:

let button=$('button')
if($('.num').css('display')=='none') button.show()
else button.hide()

Если ещё ваши селекторы подставить:

let button=$('.num')
if($('.add2cart').css('display')=='none') button.show()
else button.hide()
Answer 2

Если в css стоит

.add2cart{
  display: none;
}

Тогда достаточно

$(function(){
  if($('.num:visible').length > 0)
    $('.add2cart').fadeIn();
});
READ ALSO
setTimeout и clearTimeout

setTimeout и clearTimeout

При наведении на div c меню, фон вокруг затемняется, но если проводить так много раз, mouseenter & mouseleave из дива, начинает моргатьРешил установить...

200
Как сделать что бы iframe не грузился сразу?

Как сделать что бы iframe не грузился сразу?

Есть три таба в каждом будет ифрейм и надо что бы при нажатии они прогружались а не сразу при входе на сайт Возможно ли это?

186
jQuery сброс нажатия на ползунок

jQuery сброс нажатия на ползунок

помогите решить проблему, есть некий бустрап слайдер

211
как найти прошедшие ивенты в bootstrap year calendar

как найти прошедшие ивенты в bootstrap year calendar

для своего проэкта я использую плагие bootstrap year calendarКак можно найти прошедшие ивенты и применить например к ячейкам этого ивента какойто цвет

227