JQuery能否检测换行前一行的最后一个元素？

Question

    <style>
    .ms_menu ul{list-style:none;}
    .ms_menu ul li{float:left; padding:5px; border-right:1px solid #000000;}
    .ms_menu ul li:last-of-type{border-right:none;}
    </style>

示例HTML：

    <div class="ms_menu">
     <ul>
       <li>menu1</li>
       <li>menu2</li>
       <li>menu3</li>
       <li>menu4</li>
       <li>menu5</li>
       </ul>
    </div>

我有一个顶部导航菜单，其中包含一个带有左浮动的LI的UL。

每个LI都有CSS样式{border-right 1px solid}，它作为每个菜单选项之间的分隔符，我使用了CSS选择器last-of-type来删除最后一个LI的border-right。

这一切看起来很棒，直到浏览器窗口被重新调整大小并且一些LI掉落到第二行。此时，last-child样式规则仍然按照要求应用，但是在这一点上，我还想在它换行到第二行之前从最后一个LI中删除border-right。

是否有一种jQuery或一般Javascript的方法来检测单词换行/换行符之前的最后一个元素？

- Martin Sansom

Answer 1

你可以测量它们的 偏移量:

$(window).resize(function() {

    var offsets = [],
        $listItems = $('.ms_menu li');

    $listItems.each(function() {
        offsets.push( $(this).offset().top );
    });

    $.each(offsets, function(i, v) {
        $listItems.eq(i).css('border-right-width', v > offsets[index + 1] ? 0 : 1);
    });

}).resize();

- Joseph Silber