Php 使用数据库中的数据，将鼠标悬停在多个文本段落上弹出窗口

我试图用HTML和PHP在几个段落上弹出一个窗口。页面使用while循环从数据库加载数据，每个段落在数据库表中包含一行。下面是我代码的相关部分

在文件的开头，我有一个php部分，其中包含以下相关行：

<?php
    $kommun = $_SESSION['kommun'];
    $salary = $_SESSION['loen'];

    $sql2 = "SELECT * FROM sk_municip WHERE id = :id";
    $stmt2 = $dbh->prepare($sql2);
    $stmt2->execute(array(':id' => $kommun));

    $totalSkatt = (($salary * $result2['tax']) / 100);

    $sql3 = "SELECT id, name FROM sk_areas";
    $stmt3 = $dbh->prepare($sql3);
    $stmt3->execute();

    $sql4 = "SELECT area, part, percent, desc FROM sk-mun-".$kommun." WHERE area = :area ORDER BY percent DESC";
    $stmt4_1 = $dbh->prepare($sql4);
    $stmt4_2 = $dbh->prepare($sql4);
?>

在文档的后面，我使用上面的php创建了div和段落：

<?php while ($result3 = $stmt3->fetch()): ?>    

    <?php 
        $stmt4_1->execute(array(':area' => $result3['id']));
        $stmt4_2->execute(array(':area' => $result3['id']));
    ?>

    <?php if ($stmt4_1->fetchColumn() > 0): ?>
        <div class="taxarea">

            <div class="taximg">...</div>

            <div class="taxtext">
                <p class="inhead">...</p>
                <p class="inline">...</p>

                <?php while($result4 = $stmt4_2->fetch()): ?>
                    <?php $partSkatt = round((($totalSkatt * $result4['percent']) / 100)); ?>

                    <p class="tdone">
                        <?php echo $result4['part']; ?>
                    </p>

                    <p class="tdtwo">
                        <?php echo $partSkatt ?> kr
                    </p>

                    <p class="inline">...</p>
                <?php endwhile; ?>
            </div>
        </div>
    <?php endif; ?>
<?php endwhile; ?>

...





韩元

我想做的是，当有人将鼠标悬停在“tdone”或“tdtwo”类上时，会出现一个弹出窗口，其中包含该行的desc列中的信息。如果元组为空或NULL，则不应出现弹出窗口

这是一个复杂的问题，我希望我能用一种好的方式描述它。我知道一些制作弹出窗口的方法，但不像我现在需要的那样动态。对我来说，使用id-javascript、jquery或css并不重要，我只是需要一个好的方法来实现它

---

仅仅添加title属性是不够的。我需要，能够改变弹出框的颜色，使其看起来像页面的其余部分。

您只能在鼠标上方使用CSS：

但是从可用性的角度来看，最好使用onclick事件来折叠/扩展该区域

编辑： 我已经看过JSFIDLE了： 要使用JavaScript进行鼠标单击

---

您还需要在要显示/隐藏的区域内放置一个图像。

修复需要该功能的onhover函数，第二步是在该函数中调用webservice。。。就这样。Gud luckI试过了，正如你所说，我使用了以下代码：

/code>，但正如你所说，从可用性角度来看，它不是很好。你知道如何把它作为一项活动吗？
.tdone, .tdtwo {
    width: 400px;
    height: 100px;
    overflow: hidden;
    border:1px solid black;
    background-color: white;
}
.tdone:hover, .tdtwo:hover {
    overflow:visible;
    height: auto;
}