javascript - 来自特定 <div> 的工具提示

Question

我有一个包含许多站点的网页，其中包含有关项目的信息。我从 mysql 数据库中获取信息。现在我需要这些信息中的工具提示。

我正在寻找一种在工具提示中获得“回声”的解决方案。它不应该有太多代码，因为我想经常使用工具提示。问题是，得到整个 <div class="itembox"> 不是更容易吗？在工具提示中？

代码如下:

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

    <!-- jQuery -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>



    <div id="container">
    <div class="itembox">
    <?php
    $con = mysqli_connect("localhost","XXXXX","XXXXX","XXXXXXX");


    // Check connection
    if (mysqli_connect_errno())
      {
      echo "Failed to connect to MySQL: " . mysqli_connect_error();
      }



    /* change character set to utf8 */
    if (!mysqli_set_charset($con, "utf8")) {
        printf("Error loading character set utf8: %s\n", mysqli_error($con));
        exit();
    } else {

    }

    $sql = "SELECT * FROM TEST WHERE id=8778";

    $result = mysqli_query($con,$sql)or die(mysqli_error());

    echo "<table>";


    while($row = mysqli_fetch_array($result)) {
        $name= $row['name'];
        $itemLevel= $row['itemLevel'];


        echo
    "<tr><td class='nameepisch'>".$name."</td></tr>
    <tr><td class='itemstufe'>Gegenstandsstufe ".$itemLevel."</td></tr>

    </tr>";
    }

    echo "</table>";

<script>
$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})
</script>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="<?php $name ?>">Tooltip Title</button>


    mysqli_close($con);
    ?>

</div>
</div>

Answer 1

html 工具提示的最简单方法是为标签的 title 属性分配一个适当的值，例如:

如果 $myTooTiptext 是你想要显示的文本可能是这样的

  echo
   "<tr><td class='nameepisch' title='".$myToolTiptext .">".$name."</td></tr> 
    <tr><td class='itemstufe'>Gegenstandsstufe ".$id[$itemLevel]."</td></tr>

当您移动到名称的 td 上时，会显示工具提示文本