mysql_fetch_array的div onmouseover只適用於第一個結果

Question

我是這個網站的新手，我希望你很快就能回答。

我想要刪除圖標顯示，當用戶將鼠標懸停在他們選定的朋友，但它只出現在mysql_fetch_array的第一個結果。不適用於其他人。你能幫我嗎？我聽說這是用foreach函數完成的，但不知道如何使用它，因爲我是php的新手。

這裏是代碼。

PHP：

$q = mysql_query("SELECT * FROM `users`"); 

while ($row = mysql_fetch_array($q)) { 

echo '<div id="friends" onmouseover="showRemove();" onmouseout="hideRemove();">'; 
echo '<div id="fillexit"></div>'; 
echo '<div id="showexit"></div>'; 
echo '</div>'; 

} 

的Javascript：

function showRemove() { 
var l=document.getElementById("showexit"); 
var s=document.getElementById("fillexit"); 
l.style.display = 'block'; 
s.style.display = 'none'; 
} 


function hideRemove() { 
var p=document.getElementById("showexit"); 
var o=document.getElementById("fillexit"); 
p.style.display = 'none'; 
o.style.display = 'block'; 
} 

CSS：

#fillexit { 
width:12px; 
height:12px; 
float:right; 
} 


#showexit { 
width:12px; 
height:12px; 
background-color:#000000; 
float:right; 
text-align:center; 
display:none; 
} 

我真的並欣賞你的幫助。

Answer 1

這是因爲從PHP腳本回顯的HTML將具有相同的所有行元素的ID。

你應該使用計數器或其他東西來創建一個唯一的ID並相應地改變你的js。也許你可以將id傳給js方法來幫助查找頁面上的元素。

PHP

$q = mysql_query("SELECT * FROM `users`"); 
$count = 0; 
while ($row = mysql_fetch_array($q)) { 

echo '<div id="friends'.$count.'" onmouseover="showRemove('.$count.');" onmouseout="hideRemove('.$count.');">'; 
echo '<div id="fillexit'.$count.'"></div>'; 
echo '<div id="showexit'.$count.'"></div>'; 
echo '</div>'; 

$count = $count + 1; 

} 

JS

function showRemove(id) { 
var l=document.getElementById("showexit" + id); 
var s=document.getElementById("fillexit" + id); 
l.style.display = 'block'; 
s.style.display = 'none'; 
} 


function hideRemove() { 
var p=document.getElementById("showexit" + id); 
var o=document.getElementById("fillexit" + id); 
p.style.display = 'none'; 
o.style.display = 'block'; 
} 

Answer 2

 if($q ->num_rows()>0){ 

      foreach ($q ->result()as $row){ 

    echo '<div id="friends" onmouseover="showRemove();" onmouseout="hideRemove();">'; 
    echo '<div id="fillexit"></div>'; 
    echo '<div id="showexit"></div>'; 
    echo '</div>'; 
     } 
     }