0

我有这个标记：

<div class="cntr">
  <ul>
      <li class="frst_lvl" style="width: 125px;">
         <ul>
           <li class="scnd_lvl" style="width: 25px;"></li>
           <li class="scnd_lvl" style="width: 25px;"></li>
           <li class="scnd_lvl" style="width: 25px;"></li>
         </ul>
      </li>
      <li class="frst_lvl" style="width: 125px;"></li>
      <li class="frst_lvl" style="width: 125px;"></li>
      <li class="frst_lvl" style="width: 125px;"></li>
  </ul>
</div>

我需要将所有元素的宽度与 class 结合起来frst_lvl。我使用这个函数，但是.each()方法获取所有元素的宽度，甚至是二阶元素的宽度 - scnd_lvl。如何正确写这个？

var t = 0,
    $cntr = $('.cntr'),
    $list = $cntr.find('> ul'),
    $list_el = $list.find('> li');

function listWidth() {
    var total = t;
    $list_el.each(function() {
        total += parseInt($(this).width());
    });
    return total;
}
$list.width(listWidth());

谢谢，寻求帮助。

4

2 回答 2

0

这将为您提供所有具有类的元素的组合宽度frst_lvl

$( document ).ready(function() {
    $width = 0;
    $( ".frst_lvl").each(function( index ) {
        $width += parseFloat($(this).width());
    }); alert($width);
});
于 2013-09-30T06:58:44.583 回答
-1

$.find 会给你所有匹配的后代。在您的示例中， $list 包含两个列表， $list_el 包含 7 个项目。

改用 $.children 方法。它只在 DOM 中向下移动一个级别

$list = $cntr.children('> ul'), $list_el = $list.children('> li');

在这里查看文档：http: //api.jquery.com/children/

于 2013-09-16T21:31:33.797 回答