【发布时间】：2017-11-20 15:53:22
【问题描述】：
我正在尝试让嵌套的 CSS 下拉菜单工作。菜单中的信息是使用数据库中的结果生成的。第一个下拉菜单效果很好；只是当我将鼠标悬停在行上时，什么都没有发生。
谁能看出我哪里出错了？我的理解是，当我将鼠标悬停在类名为 test 的表格行（即<tr>）上时，它应该在右侧显示类名为 dropcontent2 的元素这个，但它不起作用><.>
下面是我目前得到的图像 - 我试图显示在我悬停在行的右侧的“测试”文本，但是即使 显示 它也只是显示属性设置为 none。
启动 PHP：
if (!empty($result))
{
echo "<div class='dropdown'>";
echo "<span class='label label-success'>Domain Found In History</span>";
echo " <div class='dropdown-content'>";
$this_database->displaySearchResults($result);
echo "</div>";
echo "</div>";
}
上面调用的PHP函数：
function displaySearchResults($idArray)
{
$servername = $this->servername;
$username = $this->username;
$password = $this->password;
$dbname = $this->dbname;
#Opens the MYSQL Connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
if (!$conn)
{
die("Connection failed: " . mysqli_connect_error());
}
## Begining of formatting of drop down table
echo "<table class='table table-condensed'>";
echo "<tr>";
echo "<th>Date</th>";
echo "<th>Time</th>";
echo "</tr>";
##Loops through all the matching ID's
for ($i = 0; $i < count($idArray); $i++)
{
$stmt = $conn->prepare("SELECT * FROM dns WHERE id LIKE '$idArray[$i]' ");
$stmt->bind_param($idArray[$i]);
$stmt->execute();
$result = $stmt->get_result();
## For ever matching ID it prints out the date/time into the drop down table
while($row=$result->fetch_assoc())
{
echo "<tr class='test'>";
echo "<td>".$row["date"]."</td>";
echo "<td>".$row["time"]."</td>";
echo "</tr>";
echo "<div class='drop2content'>";
echo "<tr>";
echo "<td>Test </td>";
echo "</tr>";
echo "</div>";
}
}
echo "</table>";
}
CSS
/* Show History Drop down Styling */
/* The container <div> - needed to position the dropdown content */
.dropdown
{
position: relative;
display: inline-block;
}
/* Dropdown Content (Hidden by Default) */
.dropdown-content
{
display: none;
position: absolute;
z-index: 1;
margin-top:2%;
background-color:white;
}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content
{
display: block;
}
.drop2content
{
display:none;
position:absolute;
background-color:white;
}
.test:hover .drop2content
{
display:block;
position:absolute;
left:100%;
top:0%;
}
.test > td
{
position:relative;
}
.test
{
position:relative;
}
【问题讨论】：
-
尝试检查 php 类是否显示预期的输出。否则你可以在你的数据库类执行之后添加一些工作示例或放置最终结果代码。
-
这是它工作的屏幕截图 - imgur.com/a/ao7ly 我想要发生的是，当我将鼠标悬停在日期/时间上时，它会在其右侧打开另一个框（就像嵌套的 HTML/CSS下拉）目前，什么都没有发生，。
-
可能是您加载表格的格式不正确。检查一下。试试这个
Date Time 今天 10.10 测试 -
感谢您的帮助，我已经用我目前所拥有的和正在得到的内容更新了我的问题 - imgur.com/a/U4I3Z 比以前更接近
标签： php html css mysql html-table