Question

现在，我正在通过PHP输出一些mysql表。我正在使用“echo命令”来显示结果。

当我将鼠标悬停在该回声中的另一个元素时，我希望显示该回声中的元素。

当我使用javascript onmouseover函数时，它会消失整个echo命令的输出。

请不要告诉我有什么问题＆amp;我应该为此做些什么。

我的代码如下：

    <head>
    <title>Untitled Document</title>
    <script language="javascript">
    function remove()
    {
    document.getElementById('delete').style.display = "block";
    }

    </script>
    </head>

    <body>

    <?php
    $con = mysql_connect("localhost","me_user","123456");
    if (!$con) {
      die('Could not connect: ' . mysql_error());
    }
    mysql_select_db("my_db", $con);
    $result = mysql_query("SELECT * FROM table ORDER BY serial desc");

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

    {

    echo "<div id='show' onmouseover='javascript:remove();'>
             <table border='0'  cellpadding='4'>
               <tr>
                 <td>".$row['fname']."&nbsp;".$row['lname']."&nbsp;".$row['content']
                 ."<br>"
                 .$row['date']."
                 </td>
               <td align='right'>
                 <div id='delete' style='display:none'>
                   <form method='post' action='delete.php id='delete''>
                    <input type='hidden' name='delete' value='".$row['serial']."'>
                    <a href='javascript:submit();'>x</a>
                   </form>
                 </div>
              </td>
            </tr>
         </table>";
    echo "</div>";
   }
    echo "<br><hr size='1' color='#DFDFDF'><br>";
   }

     mysql_close($con);
     ?>

      </body>
      </html>

从上面的代码中可以清楚地看到，id为delete的div在启动时隐藏了。我希望当我将鼠标悬停在带有id show的div上时，应显示带有id delete的div。

请有人告诉我们它是如何完成的，因为当我使用javascript时，如上面的代码中，带有id显示的div已经消失了＆amp;没有别的事情发生。

请帮帮我。

提前致谢

Answer 1

您需要为每个<div>提供唯一ID，然后使用此ID显示/隐藏一个特定元素。

最简单的方法是将循环中的当前索引添加到ID中，然后将此索引传递给JS函数。

我不熟悉PHP，但代码应该是这样的：

<div id='delete_[add current index of PHP loop here]' style='display:none'>

例如：

<div id='delete_1' style='display:none'>
...
<div id='delete_2' style='display:none'>

然后将函数调用更改为：

<div id='show' onmouseover='javascript:remove([add current index of PHP loop here]);'>

例如：

<div id='show' onmouseover='javascript:remove(1);'>
...
<div id='show' onmouseover='javascript:remove(2);'>

最后，将功能更改为：

function remove(index)
{
    document.getElementById('delete_' + index).style.display = "block";
}

希望这是有道理的，如果逻辑不够明确，请告诉我。

Answer 2

这是工作示例。我正在使用普通数组中的数据而不是mysql数据库。

<html>
<head>
    <title>Untitled Document</title>
    <script language="javascript">
        function remove(counter) {
            document.getElementById('delete'+counter).style.display = "block";
        }
    </script>
</head>


<body>

<?php
    $result = array(
        array(
            'fname' => 'some fname 1',
            'lname' => 'some lname 1',
            'content' => 'some content 1',
            'date' => 'some date 1',
            'serial' => 'some serial 1'
        ),
        array(
            'fname' => 'some fname 2',
            'lname' => 'some lname 2',
            'content' => 'some content 2',
            'date' => 'some date 2',
            'serial' => 'some serial 2'
        )
    );

    $i = 0;
    foreach($result as $row){
        $i++;
        echo "<div id='show' onmouseover='javascript:remove($i);'><table border='0'  cellpadding='4'><tr><td>"
            . $row['fname']."&nbsp;".$row['lname']."&nbsp;".$row['content']."<br>".$row['date']
            . "</td><td align='right'><div id='delete$i' style='display:none'><form method='post' action='delete.php id='delete'><input type='hidden' name='delete' value='"
            . $row['serial']."'><a href='javascript:submit();'>x</a></form></div></td></tr> </table>"
            . '</div>'
            . "<br><hr size='1' color='#DFDFDF'><br>";
    }
 ?>

</body>
</html>

你的问题在于html id必须是唯一的。

鼠标悬停在同一个echo命令中的元素上时，在php的echo命令中显示一个元素

2 个答案: