$ (element: visible) до или после $ (this)

Question

Как определить, находится ли $(element:visible) до или после $(this) в HTML?

Мой HTML-код выглядит так

<div class="wrapper" style="display:none;">
    <div class="title">1</div>
    <div class="text">Lorem Ipsum</div>
</div>

<div class="wrapper">
    <div class="title">2</div>
    <div class="text">Lorem Ipsum</div>
</div>

<div class="wrapper" style="display:none;">
    <div class="title">3</div>
    <div class="text">Lorem Ipsum</div>
</div>

<div class="wrapper" style="display:none;">
    <div class="title">4</div>
    <div class="text">Lorem Ipsum</div>
</div>

Когда я нажимаю на заголовок 2, я хочу знать, есть ли видимый $('.wrapper') перед этим заголовком.

Answer 1

Подводя итог.Вам нужно проверить, есть ли какие-либо видимые элементы с классом «обертка» перед щелчком элемента.

Если это так, это должно сделать это.

$(".wrapper").click(function() {
  var el;
  el = $(this);
  $(".wrapper:visible").each(function(index) {
    if ( el.get(0) === $(this).get(0) ) {
      alert("There are no visible wrappers prior to this one.");
      return false;
    } else {
      alert("There are visible wrappers prior to this one.");
      return false;
    }
  });
});

Или:

$(".wrapper").click(function() {
  if ( $(this).prevAll(".wrapper:visible").length ) {
    return alert("There is " + $(this).prevAll(".wrapper:visible").length  + " wrappers prior to this one.");
  } else {
    return alert("There are no visible wrappers prior to this one.");
  }
});

Answer 2

Надеюсь, это то, что вам нужно

$(".title").click(function(){
  if($(this).parent().prev().is(":visible")) alert("Previous is visible!")
});

Сообщает, видна ли предыдущая .wrapper (предыдущая по названию).

РЕДАКТИРОВАТЬ : Это решает ваш обновленный вопрос

$(".title").click(function(){
  if($(this).parent().prevAll(".wrapper").is(":visible")) alert("Previous is visible!")
});

Надеюсь, это поможет. Приветствия

Answer 3

Если вы хотите увидеть, есть ли какие-либо предыдущие видимые обертки ... $(this).parent().prev(".wrapper:visible").length()

Если вы ищете, чтобы увидеть только предыдущую, пока она не станет видимой ... $(this).parent().prev().is(":visible")

Answer 4

$('.title').click(function() {
    if ($(this).parent().prev('.wrapper:visible').length) {
        console.log('visible');
    } else {
        console.log('not visible');
    }
});

Answer 5

$(this).closest('.wrapper').prev().is(':visible');

Получит ближайшего родителя с классом wrapper, означающим, что даже если $(this) глубже внутри оболочки, он все равно будет функционировать должным образом.

Answer 6

$(this).parent("div:visible")

Это даст вам родителя, только если он виден.