0

我有一系列包含列表元素的 div。我正在尝试在 div 内本地返回列表中项目的索引。但它会计算其他 div 中的列表项，我想避免这种情况。

所以目前它返回的索引是（逗号分隔 div）：

0-5、6-7、8-17

我希望它返回：

0-5, 0-1, 0-9

所以我希望索引与每个 div 相关。

http://jsfiddle.net/K4b8J/1/

JS：

var preview = "<div class=\"preview\"><p>Test.</p></div>";
        $(".category_list.grid > ul li").click(function () {
            // calculate how many elements fit per line
            var index = $(".category_list.grid li").index(this);
            alert(index);
        });

HTML：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript"></script>
<div class="category_list grid">
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>
<div class="category_list grid">
    <ul>
        <li></li>
        <li></li>
    </ul>
</div>
<div class="category_list grid">
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

CSS：

*{padding:0;margin:0}
.preview {clear:both;}
ul {clear:both;}
li {
  width: 5em;
  height: 3em;
  background: black;
    display: inline-block;
    text-align: left;
    margin: 1em;
    color: white;
}
.category_list {margin-bottom:2em; clear:both;}
4

1 回答 1

2

因此，您只想计算相对于其兄弟元素的元素：

var index = $(this).siblings().andSelf().index(this);

http://jsfiddle.net/mattball/K8Q5D/

如果这还不够光滑：

var index = $(this).prevAll().length;

...因为毕竟，一个元素的（从零开始的）索引只是它之前的元素的数量。

http://jsfiddle.net/mattball/MRPrZ/

于 2013-02-22T04:07:07.157 回答