的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和鼠標離開只適用於第一個元素

回答

相關問題