jquery - jQuery停止工具提示插件显示html

Question

我希望我的工具提示停止显示渲染的 HTML 和标记。我注意到在中继器中显示数据时，以下工作正常。使用 jQuery Tooltip 插件 1.3。

Server.HtmlEncode(Eval("ActivityDescription") as string)

然后我想我可以对 title 属性做同样的事情

<td class="activityDescriptionTooltip" title="<%# Server.HtmlEncode(Eval("ActivityDescription") as string) %>">
<%# Utilities.TruncateAtWord(Server.HtmlEncode(Eval("ActivityDescription") as string),30) %>
</td>

通过插件这样调用的工具提示

   $j('.activityDescriptionTooltip').tooltip();

所以如果我的 ActivityDescription 是 "<h2>Test</h2>"

我想"<h2>Test</h2>"在工具提示中看到。我的标题属性呈现为

title="<h2>Test</h2>"

但在工具提示中，它仅呈现为具有 H2 格式的“测试”。

这可能吗 ？

Answer 1

是的，这不仅是可能的，而且应该与“中继器”中的工作方式相同。

您使用的函数 ( Server.HTMLEncode ) 非常适合这个。

以下应该可以正常工作

<td class="activityDescriptionTooltip" title="<%# Server.HtmlEncode("<h2>Test</h2>") %>">

您的代码的问题是您对字符串进行了两次编码（因此工具提示将显示编码的字符串）。

而不是这个：

<td class="activityDescriptionTooltip" title="<%# Server.HtmlEncode(Server.HtmlEncode(Eval("ActivityDescription") as string)) %>">

尝试这个：

<td class="activityDescriptionTooltip" title="<%# Server.HtmlEncode(Eval("ActivityDescription") as string) %>">

---

编辑：

你说这不起作用。我认为确实如此。

看看这个小提琴。如您所见，html是：

<div title="&lt;h2&gt;Test&lt;/h2&gt;">asdf</div>

如果您将鼠标悬停在右下（结果）框架中的 div 上，工具提示会显示<h2>Test</h2>得很好。至少在 IE10、FF 和 Chrome 中。（我没有尝试过其他浏览器，但如果它们在这件事上的工作方式不同，我会完全震惊）。

---

编辑2：

jQuery 工具提示插件是一个非常古老且过时的插件，它确实需要一个额外的编码级别：

检查这个小提琴

<div title="&amp;lt;i&amp;gt;Test&amp;lt;/i&amp;gt;">asdf</div>

它被编码两次并且显示得很好。

另一方面，我不推荐该插件。jQuery UI Tooltip将是您更好的选择。