Question

我显示了一行具有相同div类名但不同div ID

的项目

当我将鼠标悬停在项目上时，我正在尝试使用jquery捕获不同的ID。但是现在，我正在盘旋的每个项目，我只是在我悬停时才获得最新的ID而不是那个特定的ID。

这是我的php：

while($row = mysql_fetch_array($sql)){
$id = $row['id'];
echo "<div class='row'><div class='a' id='a_".$id."'>do something</div></div>";
}

假设这将有10行，每行div都有唯一的ID

然后这是我的jquery：

 $('.row').hover(function(){
    var a = $('.a').attr('id');
    alert(a);
    }, function(){

});

有人可以帮我弄清楚为什么我只获得最新的ID（都是一样的），而不是不同的ID？

谢谢！

Answer 1

更改

var a = $('.a').attr('id');

到

var a = $('.a', this).attr('id');

您只使用前者获取最后一个ID的原因是您的查询未指定任何上下文，这意味着您正在搜索整个文档中的a类。在多元素jQuery对象上使用attr()方法时，它只返回最后一个属性。

在这里演示 - http://jsfiddle.net/h7QDX/

Answer 2

var a = $('.a', this).attr('id');

如果要在当前上下文中查找特定元素，则需要提供上下文（this）。

Answer 3

假设您的php脚本的渲染标记类似于以下内容：

<div id="currentTarget"></div> <!-- just for the purposes of the demo -->
<div class='row'><div class='a' id='a_1'>do something</div></div>
<div class='row'><div class='a' id='a_2'>do something</div></div>
<div class='row'><div class='a' id='a_3'>do something</div></div>
<div class='row'><div class='a' id='a_4'>do something</div></div>
<div class='row'><div class='a' id='a_5'>do something</div></div>
<div class='row'><div class='a' id='a_6'>do something</div></div>

以下jQuery用于使用id检索.a元素的hover()：

$('.a').hover(
    function(){
        $('#currentTarget').text(this.id);
        // retrieve the id with: this.id
    },
    function(){
        $('#currentTarget').text('');
    });

JS Fiddle demo

显然，上述内容依赖于.a元素本身的徘徊;如果你想通过将鼠标悬停在.row元素上来触发相同的内容，那么：

$('.row').hover(
    function(){
        $('#currentTarget').text($(this).find('.a').attr('id'));
        // retrieve the id with: $(this).find('.a').attr('id')
    },
    function(){
        $('#currentTarget').text('');
    });

JS Fiddle demo

Answer 4

下面： var a = $('.a').attr('id'); 你得到第一个项目'a' 你想要$（this）

像这样：

$('.row').hover(function(){
    var a = $(this).attr('id');
    alert(a);
    }, function(){

});

如果你想div女巫包含'.row'使用.parent（很多次作为div`s）

像这样：

$('.row').hover(function(){
    var a = $(this).parent().attr('id');
    alert(a);
    }, function(){

});

Answer 5

尝试，

$('.row').hover(function(){
    var a = $('.a').attr('id');
    alert($('.a',this).attr('id'));
    }, function(){

});

不同的ID，但相同的类名称问题

5 个答案: