Question

如何确定$(element:visible)之前或之后是否放置了$(this)？

我的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

我希望这就是你需要的东西

$(".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 2

总结一下。您需要在单击元素之前检查是否有任何带有“wrapper”类的可见元素。

如果是这样，就应该这样做。

$(".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 3

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

只有在父母可见的情况下，才会给你一个父母。

Answer 4

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

将使用类wrapper获得最接近的父级，即使$(this)在包装器内部更深，它仍然可以正常运行。

Answer 5

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

Answer 6

如果您正在寻找是否有任何以前的可见包装... $(this).parent().prev(".wrapper:visible").length()

如果您想查看之前是否只有前一个可见... $(this).parent().prev().is(":visible")

$（this）之前或之后的$（元素：可见）

6 个答案: