1

这是我的jQuery：

$(window).load(function(){
  $(".mobile-handle").css({height: $("ul#active-tasks li").height()});
})

这是我的视图代码：

%li.task.clearfix[task]
  .mobile-handle

我正在尝试将 的高度设置.mobile-handle为 parent 的高度li。还在学习 JS/Jquery 很抱歉，我知道这是初级的。

4

5 回答 5

1

这将每个.mobile-handle的高度设置为其祖先的高度li

$(window).load(function(){
    $(".mobile-handle").each(function(){
        $(this).css({height: $(this).closest('li').height()});
    });
})
于 2012-07-27T03:02:05.157 回答
1

看看closest。

"Get the first element that matches the selector, beginning at the current element and progressing up through the DOM tree."

参考

$(window).load(function(){
    $(".mobile-handle").css({
        'height': $("ul#active-tasks").closest('li').height()
    });
});
于 2012-07-27T03:10:07.777 回答
0

也许使用 :parent 选择器就可以了。

$(window).load(function(){
    $(".mobile-handle").css({height: $(".mobile-handle:parent").height()});
})
于 2012-07-27T02:58:09.643 回答
0

尝试：

$(".mobile-handle").height( $("#active-tasks li").height() );

或者

$(".mobile-handle").height( $(".mobile-handle").parent('li').height() );
于 2012-07-27T02:58:33.977 回答
0

这里我已经为上面的查询做了 bin，你也可以找到演示链接。

演示： http ://codebins.com/bin/4ldqp9d

HTML：

<ul id="active-tasks">
  <li>
    <div class="mobile-handle">
      Mobile-1
    </div>
  </li>
  <li>
    <div class="mobile-handle">
      Mobile-2
    </div>
  </li>
  <li>
    <div class="mobile-handle">
      Mobile-3
    </div>
  </li>
  <li>
    <div class="mobile-handle">
      Mobile-4
    </div>
  </li>
</ul>

CSS：

#active-tasks{
  padding:4px;
  border:1px solid #445599;
  list-style:none;
  width:50%;
  background:#f9c8c5;
}
#active-tasks li{
  height:30px;
}

查询：

$(function() {

    $(".mobile-handle").height($(".mobile-handle").parent('li').height());
    /*
    //Another Alternate way is:
    $(".mobile-handle").height( $(".mobile-handle").closest('li').height() );*/

});

演示： http ://codebins.com/bin/4ldqp9d

于 2012-07-27T12:09:16.573 回答