使用 CSS 和 PHP/MySQL 的动态下拉菜单
Posted
技术标签:
【中文标题】使用 CSS 和 PHP/MySQL 的动态下拉菜单【英文标题】：Dynamic drop down menus using CSS and PHP/MySQL 【发布时间】：2015-06-30 13:30:04 【问题描述】：我想使用 php 和 mysql 创建一个动态下拉菜单。菜单还可以，但不是我想要的方式。
我想要这样的菜单如下（垂直排序并限制垂直和水平的项目数量）
我尝试按照以下代码实现这一点：
<?php foreach ($result as $riw) ?>
<div class="four columns">
<li><a href="<?php echo $riw['fmprmlink']; ?>"><?php echo
$riw['remedy_name']; ?></a> </li>
</div>
<?php ?>
通过上述方法，我得到了这个结果，这是不需要的
如果不使用<div class="four columns">，结果如下，再次不需要
我希望项目按字母顺序垂直排列和显示。
【问题讨论】：
在您的查询中，您可以添加 order_by 并检查。 但无论如何都不会安排项目..请看看我的要求 您可以添加条件，并在此基础上创建其他列并放置您的数据。就像在 10 行之后的第一列中一样，它将创建其他列等等...希望我没有错。 ！！ 我知道的想法。但是如何实现这一点不确定... 关于您的两个结果，什么是“不需要”？你能在你的问题中解释你需要什么吗？ 【参考方案1】：先排序，然后是第二列，然后是等列的简单可能性。 有什么可以改进的。 显示多种可能性之一。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>4 columns</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<?php
function setline($conte,$i,$count,$ILines)
$act1 = $i;
$act2 = 1*$ILines + $i;
$act3 = 2*$ILines + $i;
$act4 = 3*$ILines + $i;
echo "<li>".$conte[$act1]."</li>\n"; // 0
if ($act2 < $count) echo "<li>".$conte[$act2]."</li>\n";
if ($act3 < $count) echo "<li>".$conte[$act3]."</li>\n";
if ($act4 < $count) echo "<li>".$conte[$act4]."</li>\n";
//-----------main---------------
echo "<ul id=\"quad\">";
$anArry = array("CSS","XHTML","Semantics","Accessibility","Usability","Web Standards","PHP","Typography","Grids","CSS3","HTML5");
sort($anArry);
$count = count($anArry);
$Idiv = (int)($count/4);
if ($count - ($Idiv * 4)>0) $ILines = $Idiv+1; else $ILines = $Idiv;
for ($i = 0; $i < $ILines; $i++)
setline($anArry,$i,$count,$ILines);
echo "<ul/>";
?>
</body>
</html>
接下来是4 column list 的正常标准外观。
为了得到它，我们只更改了for loop。
从左到右排序（不是 OP想要的）
for ($i = 0; $i < $count; $i++)
echo "<li>".$anArry[$i]."</li>\n";
现在我们知道了矩阵...
1| 0-2 3-5 6-8 9-11
col| 1 2 3 4
---|---------------
r 1| 0 3 6 9
o 2| 1 4 7 10
w 3| 2 5 8 11
...我们可以写一个更简单的函数。
function sortfor4c($cont,$i,$ILines,&$ICol,&$IRow)
echo "<li>".$cont[$ICol * $ILines - $ILines + $IRow -1]."</li>\n";
$ICol++;
if ($ICol > 4)
$ICol = 1;
$IRow++;
....
$ICol = 1;
$IRow = 1;
for ($i = 0; $i < $count; $i++)
sortfor4c($anArry,$i,$ILines,$ICol,$IRow);
style.css
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6
margin:0;
padding:0;
ol,ul
list-style:none;
body
font-family:Georgia, "Times New Roman", Times, serif;
color:#333;
ul
width:760px;
margin-bottom:20px;
overflow:hidden;
border-top:1px solid #ccc;
li
line-height:1.5em;
border-bottom:1px solid #ccc;
float:left;
display:inline;
#quad li width:25%;
【讨论】：
在这里实现了你的代码ayurvedamantram.com/index1，但它根本不起作用 @Gags ：你试过上面的 32 行代码吗？它很简单并且可以运行。 @Gags ：从第一行复制到最后一行并保存到像show.php 这样的文件中。在浏览器中运行show.php。它开箱即用。与“style.css”在同一个文件夹中。
我会试着让你知道 moskito-x
@Gags ：我也可以在您的代码中看到：<ul> <li><a href='#'>Acidity</a></li> 没有 id 之类的：<ul id="quad"> <li>Acidity</li>【参考方案2】：
以下代码使用 2 个循环从 assoc 数组创建一个 4 列的表。 $z 被计算为按升序对每一列中的行进行排序。
$count = count($result);
$rows= floor($count/5);
for ($x = 0; $x <= $rows; $x++)
for ($y = 0; $y <= 4; $y++)
$z=($rows*$y)+$x+$y;
if($z<$count)
$html .="<td>".$result[$z]['fmprmlink']."</td>\n";
else
$html .="<td></td>\n";
$html .="</tr>\n";
$html .="</table>";
echo $html;
【讨论】：
编辑您的图片。一半的答案是空白的。【参考方案3】：大概，您会想要使用某种 for 循环来适当地对数据进行排序。你可以用 PHP 来做这件事，也可以用 javascript 来做。
无论哪种方式，您都需要处理服务器返回的条目，以限制添加到每列的行数。处理数据的方式取决于服务器返回的方式。如果服务器发送代表相关数据单元的 JSON 数据（并且您正在使用 AJAX），您可能需要采用 javascript 方法。如果您计划在初始页面加载时加载所有菜单字段数据，您可能可以使用 PHP 来创建菜单条目。
This 是一个使用 for 循环使用 PHP 创建表的示例。您应该能够对列表项和/或 div 执行相同的操作。如果这个答案令人困惑，那么 SO 和整个互联网上还有许多其他示例。
<?php
echo "<table border='1'><br />";
for ($row = 0; $row < 5; $row ++)
echo "<tr>";
for ($col = 1; $col <= 4; $col ++)
echo "<td>", [YOUR MENU ENTRY GOES HERE], "</td>";
echo "</tr>";
echo "</table>";
?>
【讨论】：
一个合适的例子完全依赖于您的数据库返回的数据。我刚刚添加的示例是针对数据库返回菜单项数组的一般情况。以上是关于使用 CSS 和 PHP/MySQL 的动态下拉菜单的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 php/Mysql 动态更改 CSS 样式。我想创建每个用户独有的主题？
来自 PHP/MySQL 的 Ajax 加载生成带有变量传递的 Bootstrap 下拉列表
当 css id 和 name 都是动态生成时，Capybara 从嵌套下拉列表中选择