JQUERY 如何遍历多个相同 DIV

[xiaozy]

<div class="list">
    <div class="box">
        <div class="header">头部 1</div>
        <div class="content">内容 1</div>
    </div>
</div>
<div class="list">
    <div class="box">
        <div class="header">头部 2</div>
        <div class="content">内容 2</div>
    </div>
</div>
<div class="list">
    <div class="box">
        <div class="header">头部 3</div>
        <div class="content">内容 3</div>
    </div>
</div>

代码如上，就是，点击content显示当前点击的是第几个，比如点击内容 1的content就显示1，点击内容 2就显示2以此类推。。。因为以上内容是列表并固定形式输出，所以不知道该怎么遍历...求解，先谢谢啦！~

[Pan940425]

div 上加上 id 不就好了。。。

[xiaozy]

@Pan940425 感谢回复，结构是列表输出生成并且固定，没法加啊。

[Hozart]

@xiaozy 可以遍历所有的目标 div 并加上升序 ID

[ferrum]

不太明白你在问什么，你用$('.list')获取的数组就是有序的，$('.list').eq(0)就是 HTML 中的第一个 div.list 元素。

[domty]

你可以直接绑定所有 class = content 的方法的点击触发方法啊；

$(".content").click(function(){
var text = $(this).html();//获取的是 content div 内的内容。
})

或者$(".list").foreach(function(){...});来遍历所有 class = list 的 div。

[sundev]

(function($contents){
$contents.on('click', function(event) {
$contents.each(function(i, item) {
if (event.target === item) {
console.log(i+1);
return false;
}
});
});
})($('.content'));

[Pan940425]

$(".content").each(function(i) {
$(this).on("click", function() {
let j = i + 1;
alert(j);
})
})

你要的是这个？

[littleylv]

$(".content").click(function(){
console.log($(this).parent().parent().index() + 1);
});

[iiduce]

$('div.list div.content').each(function(i){
$(this).click(function(){
alert(i+1);
})
})

[SakuraKuma]

为何不用 parents('.list').index。 方便快捷

[davin]

也能用 closest('.list').index