javascript - 我在所有工具提示中得到与我的第一个 id 相同的文本，即使它不属于该 id

Question

我正在尝试学习一些 Javascript，并将其与 PHP 和 HTML 结合起来。目前，我遇到的问题是，当我将鼠标悬停在第二个或第三个 div 上时，它会写下我在第一个 div 中的内容。

    $posts = get_posts(((isset($_GET['id'])) ? $_GET['id'] : null));

    foreach($posts as $post){
    ?>
        <div onmouseover="fixad()" onmouseout="tabort()" style="background-color:red; width:100px;"><?php echo $post['user'] . " " . $post['contents'] . "<br>";?></div><br>
        <div id="popup" style="display:block; background-color:black; width:100px; height:100px; color:white; float:right;"><?php echo $post['date_posted'] .  " " . $post['user']; ?></div>
    <?php
    } ?>

我的 get_posts 函数如下所示:

    function get_posts($id = null) {
      $posts = array();
      $query = "select contents, user, date_posted FROM database where id=$'id'";
      $query = mysql_query($query);
      while($row = mysql_fetch_assoc($query)){
        $posts[] = $row;
      }
      return $posts;
    }

我的 Javascript 很简单，如下所示:

    function fixad() {
      var r = document.GetElementById("popup");
      r.style.display = "block";
    }

    function tabort(){
      var r = document.GetElementById("popup");
      r.style.display = "none";
    }

总结一下:我想在 1 div 中写出 id = 5 的文本。但是我从 id = 5 获取文本，而它应该来自另一个 id。

所以我的

    <div id="popup"<?php echo $post['id'];?></div>

将在每个弹出窗口中打印出相同的 id。

如果这让您感到困惑，我很抱歉，如果您愿意，我可以详细说明。

Answer 1

所有元素都有相同的 ID。因此 document.GetElementById("popup"); 每次都会获取第一个元素。 Id 应该是唯一的。我将使用 posts 传回每个帖子的 id，然后将其与 id 一起放入，以便可以正确识别每个 div。

<div id="popup" 

至:

<div id="popup' . $id . '"