通过JavaScript添加工具提示

我正在尝试添加显示图像的工具提示。这需要通过JS注入来完成。我可以使用jQuery。对于测试-我在两个视图中使用相同的图像，当用户将鼠标悬停在图像上时，它应该在工具提示中显示相同的图像。以下是我当前不工作的代码：

<img src="https://images.quickbase.com/si/16/751-binary_view.png"  onload="$(this).tooltip({content: "<img src='https://images.quickbase.com/si/16/751-binary_view.png'/>"});">

“}）；“>

编辑：我添加了一个

数据工具提示

，以使用工具提示标记图像（与不使用工具提示的图像相比）

您必须转义引号（至少）：

\”
});"
/>

也许最好把它完全排除在标签之外

<img src="https://images.quickbase.com/si/16/751-binary_view.png"
  data-tooltip="true" />

在标题的某个地方：

$(function () {
  $("img[data-tooltip='true']").each(function () {
    $(this).on("load", function () {
     var content;

     content = "<img src='{src}'/>".replace("{src}", $(this).attr("src"));
     $(this).tooltip({ "content": content });
    });
  });
});

$（函数（）{
$（“img[data tooltip='true']）。每个（函数（）{
$（此）.on（“加载”，函数（）{
var含量；
content=”“.replace（“{src}”，$（this.attr（“src”））；
$（this.tooltip（{“content”：content}）；
});
});
});

---

data tooltip=“true”

属性允许您准确选择哪些图像应该有工具提示，哪些没有（在后一种情况下只需忽略它）。

您使用了哪些工具提示库？只需使用或任何其他工具提示插件即可。jQuery工具提示：

$(function () {
  $("img[data-tooltip='true']").each(function () {
    $(this).on("load", function () {
     var content;

     content = "<img src='{src}'/>".replace("{src}", $(this).attr("src"));
     $(this).tooltip({ "content": content });
    });
  });
});