当不隐藏时，只显示sql的第一个结果

Only the first results of sql show when unhidden

本文关键字：sql 第一个 结果 显示 隐藏      更新时间：2023-09-26

我之前问了一个关于如何使用jquery在单击时隐藏和显示sql结果的问题。感谢Þaw帮了我的忙…现在我转向了类似但又不同的东西，更像是"代码中的bug"。我有一个php文件，从db表中检索所有数据，只显示一行(表中数据的标题)。单击标题后，将显示一个隐藏的div，该div返回其余数据。我在这里遇到的问题是，在表中的多个条目…显示/隐藏魔术只适用于第一行，无论我单击哪个标题。

这是我的js

function showDiv() {
if (document.getElementById('hiddenDiv').style.display == 'block') {
        document.getElementById('hiddenDiv').style.display = 'none';
    } else {
        document.getElementById('hiddenDiv').style.display = 'block';
    }
}
这是我的php/html 
<div><h2 Style="margin:auto;display: block; padding-bottom: 0; margin-bottom: 0;    background: #e0741b; width: auto;color: white;" onclick="showDiv();"><?php echo   $rows['title']; ?></h2></div>
<div id="hiddenDiv" style="display:none">
<strong><h3 style="color:black" ><? echo $rows['name']; ?></h3></strong><br/>
<p style="color: grey; font-size:10pt;"><strong><?php echo $rows['details']; ?>  </strong></p>
<p style="font-size: 10pt;"> <strong>Email:</strong> <?php echo $rows['email']; ?></p>
<p style="font-size: 10pt;"> <strong>Phone:</strong> <?php echo $rows['phone']; ?></p>
<p style="font-size: 10pt;"> <strong>Link:</strong> <?php echo $rows['link']; ?></p>

</div>

不是我要写的代码，而是使用您自己的代码来解决隐藏/显示问题:注意$rows['id']的添加，这假设数据有一个名为id的字段(将其更改为实际唯一字段名称)

    <script>
        function showDiv(id) {
            if (document.getElementById('hiddenDiv'+id).style.display == 'block') {
                document.getElementById('hiddenDiv'+id).style.display = 'none';
            } else {
                document.getElementById('hiddenDiv'+id).style.display = 'block';
            }
        }
    </script>
--LOOP STARTS--
    <div>
        <h2 Style="margin:auto; display: block; padding-bottom: 0; margin-bottom: 0; background: #e0741b; width: auto;color: white;" onclick="showDiv(<?php echo $rows['id']; ?>);"><?php echo $rows['title']; ?></h2></div>
    <div id="hiddenDiv<?php echo $rows['id']; ?>" style="display:none">
        <strong><h3 style="color:black"><? echo $rows['name']; ?></h3></strong><br />
        <p style="color: grey; font-size:10pt;"><strong><?php echo $rows['details']; ?>  </strong></p>
        <p style="font-size: 10pt;"><strong>Email:</strong> <?php echo $rows['email']; ?></p>
        <p style="font-size: 10pt;"><strong>Phone:</strong> <?php echo $rows['phone']; ?></p>
        <p style="font-size: 10pt;"><strong>Link:</strong> <?php echo $rows['link']; ?></p>
    </div>
-- LOOP ENDS ---

那么你要做的就是给hiddendiv一个唯一的id然后把这个id传递给show/hide js函数这样它就知道要显示和隐藏

每个DOM元素只能有一个ID属性值。每个ID必须是文档唯一的。

循环在哪里?我错过什么了吗?在隐藏的DIV中应该有如下内容。这是一个通用的表格，根据你所做的调整它。我不确定您正在使用哪个数据库连接，这是假设PDO。

echo '<table>';
echo '<thead><tr><td>Name</td><td>details</td><td>email</td><td>phone</td></tr></thead>';
while ($row = $stmt -> fetch(PDO::FETCH_ASSOC)) {
  echo '<tr>';
  echo '<td>' . $row['name'] . '</td>';
  echo '<td>' . $row['details'] . '</td>';
  echo '<td>' . $row['email'] . '</td>';
  echo '<td>' . $row['phone'] . '</td>';
  echo '</tr>';
}
echo '</table>';

我知道这与你想要的布局不同，但这是总体思路。

希望对你有帮助。

相关文章：