使用 php、js、sql 显示/隐藏多个 div答案

【问题标题】：show / hide multiple div using php, js, sql使用 php、js、sql 显示/隐藏多个 div
【发布时间】：2015-01-26 23:37:10
【问题描述】：

我在显示 div 的内容时遇到了问题。我想使用 idpost 变量显示 div，但我不知道该怎么做。现在，当我按下显示/隐藏按钮时，仅适用于第一个 div。我想使用 id var 来做到这一点。下一个代码是我在索引页面中使用包含的 php 文件。它用一个数组向我展示了数据库的所有记录。

<?php
    include "connections/con1.php";
                    mysql_select_db($database_con1, $con1);
                    $query_Recordset1 = "SELECT * FROM `general` ORDER BY `timestamp` DESC LIMIT 9 ";
                    $result = mySQL_query ( $query_Recordset1 ) ; while ( $row_Recordset1 = mySQL_fetch_array ( $result ) ){

    $idpost=$row_Recordset1['idpost'];
    $msg_id=$row_Recordset1['timestamp'];
    $titulo=$row_Recordset1['titulopost'];
    $message=$row_Recordset1['contentpost'];
        if  (strlen($message) > 100) {
              $text = substr($message, 0,600);

    echo $idpost;

    echo '<div class="article" target="<?php $idpost; ?>">
        <div id="noticia"> 

                <h1>
                    '.$titulo.''." ".''.$msg_id.'
                </h1>'.'
                <h2 id="noticia_corta">
                     '.$text.''."...".'

                <input type="button" name="answer" value="Show Div" onclick="showDiv()" /> 
                <input type="button" id="hideDivButton" value="Hide Div" onclick="hideDiv()" />

            <h2 id="hiddenDiv" style="display:none;">
                <div   class="answer_list"> 
                            '.$message.'
                    <input type="button" name="answer" value="Show Div" onclick="showDiv()" /> 
                    <input type="button" id="hideDivButton" value="Hide Div" onclick="hideDiv()" />
                </div>
            </h2>

        </div>
    </div>';
 }
 } ?>

这是执行div的动作的js函数，但我不知道如何关注问题

   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>

<script type='text/javascript'>
    function showDiv() {
   document.getElementById('hiddenDiv').style.display = "block";
document.getElementById('noticia_corta').style.display = "none";
}
function hideDiv() {
document.getElementById('hiddenDiv').style.display = "none";
 document.getElementById('noticia_corta').style.display = "block";
}

谢谢^^

【问题讨论】：

首先停止使用MySQL functions并转换为mysqli或PDO
我想显示我的数据库的记录，按时间戳排序。对于此记录中的每一条，仅显示有限大小的单词。最后放一个 show /hide 显示记录的完整内容。
你错过了一个结束标签 </h2> 为 id noticia_corta
真的，谢谢哈哈^^

标签： javascript php sql web show-hide

【解决方案1】：

使用 class 而不是 id。 Id 的 仅适用于 1 个元素，而类适用于多个。在 HTML 中，两个 div 应该具有相同的类。

<div class="showHide">

在 Javascript 代码中，使用 getElementsByClassName() 代替 getElementById()

【讨论】：