jquery - 如果子级具有CSS并调整父级的大小，并使用jQuery获取子级索引

如果孩子的身高改变，我试图动态地改变多个父母的身高。

每个父级只有一个孩子具有z-index样式。

这是我根据发现的结果尝试做的

的HTML

<div class="parent">
    <div class="child"></div>
    <div class="child2"></div>
    <div class="child3"></div>
</div>
<br>

<div class="parent">
    <div class="child" style="z-index:1;"></div>
    <div class="child2"></div>

</div>
<br>

<div class="parent">
    <div class="child" ></div>
    <div class="child2" style="z-index:1;"></div>

</div>

JQUERY

$(".parent").each(function() {

  var divIndex = ;
  var divHeight = ;

  if ($('this').children().css('z-index') == '1')
{
   // Get height and index of the single specific element with z-index css
}

$('this').resize();
    $('this').delegate();


});

JSFiddle

最佳答案

您的代码充满了javascript错误，更具体地说是$（'this'）的使用，请删除单引号：$（this）;

由于使用id而不是类，因此大多数CSS不会样式化。

这是一个更新的jsfiddle，它纠正了这些错误，并使您在迭代父子div的正确轨道上：

http://jsfiddle.net/EgbLk/4/

$('.parent').children().each(
    function(){

      var divIndex = null ;
      var divHeight = null ;

      if($(this).css('z-index') === '1') {
         alert('z-index is 1');
      }

      $(this).parent().resize();
      $(this).parent().delegate();
    }
);

这是一些“更正”的CSS：

.parent {
    width: 100px;
    padding: 10px;
    background:#ff0000;
}

.child2 {
    position: absolute;
    width: auto;
    left: 0px;
    right: 0px;
    height:20px
}

.child {
    position: absolute;
    width: auto;
    left: 0px;
    right: 0px;
    height:50px
        z-index:1;
}

.child3 {
    position: absolute;
    width: auto;
    left: 0px;
    right: 0px;
    height:100px
}

关于jquery - 如果子级具有CSS并调整父级的大小，并使用jQuery获取子级索引，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/11350382/