1

目前,在对 mysql 进行查询后,所有数据都显示在 HTML 表中,例如:

会员号 | 姓名 | 姓氏 | 地址 | 年龄 | 国籍 | 编号 | 卡| 职业..

问题是所有内容都被压缩并且在 HTML 表格中显示不好。

我希望可能只显示会员编号、姓名和姓氏,一旦您单击会员编号,所有数据就会整齐地显示。

不确定是否需要使用 JavaScript,但如果您至少可以给我一个关于如何能够以简洁的方式显示所有数据的线索,我会很高兴。

谢谢

4

4 回答 4

1

我是此类任务的定义列表的忠实拥护者,但您可以将其与表格结合以获得相同的效果。这是一个演示:

http://jsfiddle.net/crazytonyi/rZfKg/

于 2012-05-06T08:01:45.940 回答
1

如果我理解正确,您需要一个显示每个成员的会员编号、姓名和姓氏的 HTML 表格。当您单击会员编号时,您希望它显示其余的详细信息。我认为 Surreal Dreams 使用 Javascript 来完成这部分是正确的。

它可能看起来像这样(请原谅伪代码 - 不记得 foreach 语法):

echo "<table id='data'>";
foreach ($row in $sqltable)
{
  echo "<tr>";
  echo "<td><a onclick='displaymoreinfo'>".$row['id']."</a></td>";
  echo "<td>".$row['name']."</td>";
  echo "<td>".$row['surname']."</td>";
  echo "</tr>";    
} 
echo "</table>";

然后,您需要在文件顶部有一个 javascript 方法,该方法类似于此人在此处所做的操作:http: //viralpatel.net/blogs/2009/03/dynamically-add-remove-rows-in-html -table-using-javascript.html

-劳拉

于 2012-05-06T07:50:58.440 回答
1

一种选择是使用 jQuery 和datatables

与您的普通 HTML 一起使用,您的表格会立即转换为可排序、分页、样式等的表格。您当然可以选择要应用的设置。

您还可以编写自己的 PHP 表类或脚本,与 CSS 一起根据您的输入呈现数据。然后,您可以使用 PHP 数组指定这些参数,可能是这样的:

PHP:

假设您的 SQL 查询脚本最终返回表数据,如下所示:

$tbl_data = array(
   0 => array("nr" => "10", "name" => "John", "surname" => "Smith", "address" => " Plaza Hotel Room 12", "age" => "44", "nat" => "Syldavian", "id" => "12345", "card" => "MasterCard", "prof" => "Pet Washer"),
   1 => array("nr" => "11", "name" => "Captain", "surname" => "Haddock", "address" => "Marlinspike Hall", "age" => "55", "nat" => "British", "id" => "133455", "card" => "Discovery", "prof" => "Captain")

);

然后你可以像这样指定你的输入参数:

$arr_cols = array("nr" => "Membership Number", "name" => "Name", "surname" => "Surname", "address" => "Address", "age" => "Age", "nat" => "Nationality", "id" => "ID", "card" => "Card", "prof" => "Profession");

$arr_align = array("nr" => "center", "name" => "left", "surname" => "left", "address" => "left", "age" => "center", "nat" => "center", "id" => "center", "card" => "left", "prof" => "left");

$lst_show = array("nr", "name", "surname");

然后可以始终使用此表视图方法,而与您的特定输入无关:

$html = "<table class='grid'>\n";
// headings
foreach ($arr_cols as $key => $title) {
    if (in_array($key, $lst_show))
        $html .= "<tr><th>$title</th></tr>\n";
} 
//rows
foreach ($tbl_data as $arr_row) {
   foreach ($arr_row as $key => $data) {
     if (in_array($key, $lst_show)) {
        $align = !empty($arr_align[$key]) ? " align='" . $arr_align[$key] . "'" : '';
        $html .= "<tr><td$align>$data</td></tr>\n";
    }
  }
}
$html .= "</table>\n";

echo $html;

CSS:

table.grid {border:1px solid blue; etc.}
table.grid th {etc.}
table.grid td {etc.}
于 2012-05-06T07:56:18.797 回答
0

简短的回答是,如果您想输出数据,然后根据用户交互更改显示的信息,您将需要 JavaScript。具体来说,我建议使用 jQuery 来处理这类事情。您仍然需要想出一种巧妙的方式来使用 HTML 和 CSS 显示您的数据,然后让 JavaScript/jQuery 显示漂亮的演示文稿。

然而,“整齐地”呈现是相当主观的——你必须决定你想要显示什么以及如何布局,这将是所有的 CSS 和 HTML。我会马上告诉你,避免使用表格 - 选择良好的语义 HTML。

于 2012-05-06T07:32:28.787 回答