Question

<div class="top">
    <div class="hp_class">
        This is div1.
    </div>
    <div>
        <form id="newsletter" name="myForm" method="post">    
            <div class="hp_rt">
                <div class="subscribe subs_failure">Subscribe now</div>
            </div>
        </form>
    </div>
    <div class="hp_class">
        This is div3.
    </div>
</div>

我需要div标记的索引

例如，如果我点击Subscribe now，我需要它的索引为2

我试过的代码是

$('.hp_rt>.subscribe').click(function(){
    var div_count=$(this).parent('.hp_promo_rt').parents('div').index($(this).parent('.hp_rt').parents('div'));
    alert(div_count);
});

Answer 1

我建议：

$('.subscribe').click(function(){
    var i = $(this).closest('form').parent().index();
    console.log(i);
});

JS Fiddle demo

尽管JavaScript是从零开始的，但这将返回（假设您发布的HTML）1，而不是2。

参考文献：

Answer 2

所以我理解你想要与.top的直接孩子相关的索引，使用这个

$('.hp_rt>.subscribe').click(function(){
   alert($(this).closest('.top > div').index());
});

这将为您提供从零开始的索引，您可以添加1以将警报设为“2”

Answer 3

你可以这样做：

$('.hp_rt>.subscribe').click(function() {
    var $div = $(this).parents('.top > div'); // This is the Div you want the index of!
    var $prevs = $div.prevAll('div'); // This are all the Divs before the Div!
    var number = $prevs.size() + 1; // There is one div before the div in question, so this gives 2 in this case.
});

或者你可以使用index（）：

$('.hp_rt>.subscribe').click(function() {
    var $div = $(this).parents('.top > div'); // This is the Div you want the index of!
    var number = $div.index() + 1;
});

使用jquery获取div的索引

3 个答案: