如何根据数据属性获取active div的索引

How to get the index of active div based on their data attributes

我想根据数据属性了解活动 div 的索引。

目前我使用以下方法获取已排序表的索引,但如果未排序,则无法使用:

var count = $(".active").index();
$( ".count" ).html( count + 1 );

<div id="wrapper">
    <div class="data" data-foo="23"></div>
    <div class="data" data-foo="653"></div>
    <div class="data active" data-foo="5"></div>
    <div class="data" data-foo="12"></div>
    <div class="data" data-foo="0"></div>
</div>
<div class="count"></div>

尝试

var count = $.inArray($("[data-foo]").filter(".active").data("foo")
              , $.map($("[data-foo]"), function(el, i) {
                  return Number(el.attributes["data-foo"].value)
              }).sort(function(a, b) {
                return a - b
            }));

$(".count").html(count);

var count = $.inArray($("[data-foo]").filter(".active").data("foo"), $.map($("[data-foo]"), function(el, i) {
  return Number(el.attributes["data-foo"].value)
}).sort(function(a, b) {
  return a - b
}));

$(".count").html(count); // +1 ?
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="wrapper">
  <div class="data" data-foo="23"></div>
  <div class="data" data-foo="653"></div>
  <div class="data active" data-foo="5"></div>
  <div class="data" data-foo="12"></div>
  <div class="data" data-foo="0"></div>
</div>
<div class="count"></div>