的mouseenter和鼠标离开只适用于第一个元素

我是从数据库中获取这样的数据：的mouseenter和鼠标离开只适用于第一个元素

$sql = "SELECT * FROM articles WHERE uid='".$uid."'"; 
$res = mysql_query($sql) or die (mysql_error()); 

if (mysql_num_rows($res) > 0) { 

    while ($row = mysql_fetch_assoc($res)) { 
     $article_id = $row['id']; 
     $author = $row['author']; 
     $article_name = $row['article_name']; 
     $num_views = $row['num_views']; 
     $rate = $row['rate']; 
     $times_rated = $row['times_rated']; 
     $edit_time = $row['edit_time']; 
     echo "<div id='list_articles'>"; 
     echo "<a class='normal_link' href='view_article.php?id=".$article_id."'>".$article_name."</a>"; 
     echo "<span class='del' id='".$article_id."'>x</span>"; 
     echo "</div>"; 
    }

，我使用这个代码隐藏带班德尔跨度：

.del { 
    float:right; 
    width:10px; 
    text-align:center; 
    color:#3B581E; 
    border:1px solid #3B581E; 
    display:none; 
}

我我试图做的是要查看SPAD带班“DEL”每当我mouseenter在div id为list_articles并隐藏相同跨度每当我mouseleave股利，我使用这个jQuery代码为：

$(document).ready(function(){ 
    $('#list_articles').mouseenter(function(){ 
     $('span', this).show(); 
    }).mouseleave(function(){ 
     $('span', this).hide(); 
    }); 
});

效果似乎工作，但只能用我的网页上的第一个结果，并且不与下面的div的其余部分，任何想法工作吗？

感谢帮助:)

来源

2012-02-27 wfareed

不使用ID使用类而不是 – mgraph 2012-02-27 12:26:54

完美工作，但我不明白为什么，如果，如果我使用的ID，我已经使用$（本），以确定目标元素是现在的工作。 – wfareed 2012-02-27 12:30:14

你应该永远只能有一个页面上的ID的一个实例。如果要有一个以上的班级使用。 – Alex 2012-02-27 12:30:29

echo "<div id='list_articles' class="listArticles">"; 

$(document).ready(function(){ 
    $('.listArticles').mouseenter(function(){ 
     $('span', this).show(); 
    }).mouseleave(function(){ 
     $('span', this).hide(); 
    }); 
});

来源

2012-02-27 12:28:58 mgraph

id S的关系是独一无二的 - 你应该添加/将其更改为一类，然后绑定你的事件类 - 这将绑定与该班所有的DOM元素你的活动。

PHP：

while ($row = mysql_fetch_assoc($res)) { 
     $article_id = $row['id']; 
     $author = $row['author']; 
     $article_name = $row['article_name']; 
     $num_views = $row['num_views']; 
     $rate = $row['rate']; 
     $times_rated = $row['times_rated']; 
     $edit_time = $row['edit_time']; 
     echo "<div class='list_articles'>"; /// Updated - changed id to class 
     echo "<a class='normal_link' href='view_article.php?id=".$article_id."'>".$article_name."</a>"; 
     echo "<span class='del' id='".$article_id."'>x</span>"; 
     echo "</div>"; 
    }

的JavaScript：

$(document).ready(function(){ 
    $('.list_articles') // changed the selector 
     ... 
    }); 
});

来源

2012-02-27 12:29:01 ManseUK

大，非常感谢，这是现在的工作:) – wfareed 2012-02-27 12:34:19

使用list_articles为一类，而不是ID，因为有相同ID的元素没有正常工作

来源

2012-02-27 12:31:41

的mouseenter和鼠标离开只适用于第一个元素

回答

相关问题