为什么jQuery Tooltip不显示html内容？ [英] Why jQuery Tooltip does not show html content?
问题描述
我在html页面上创建了一个jQuery工具提示。我想在超链接上显示html内容的工具提示。但jQuery的工具提示只是在工具提示内显示所有HTML文本为正常文本，但没有html格式。有一个jQuery Tooltip的例子。
< head>
< title> jQuery工具提示< / title>
< link rel =stylesheethref =http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css/>
< script src =http://code.jquery.com/jquery-1.9.1.js>< / script>
< script src =http://code.jquery.com/ui/1.10.2/jquery-ui.js>< / script>
< script>
$（function（）{
$（document）.tooltip（）;
}）;
< / script>
< style>
标签{
display：inline-block;
width：5em;
}
< / style>
< / head>
< body>
< a href =＃title =< font color ='＃FF0000'>这就是这个小工具< / font>>工具提示< / a>
< / body>
工具提示并非在红色中显示文字这就是这个小工具 / strong>，它显示< font color ='＃FF0000'>这就是这个小部件< / font> 。 html格式不适用于工具提示文本。似乎该工具提示无法识别html格式。问题似乎是工具提示上的样式不正确，或者可能是jQuery工具提示不支持html内容。
我想知道为什么我的jQuery工具提示不能显示html内容？我需要一些帮助解决我的问题。
使用内容选项提供工具提示 $（function（）{
$（'[title]'）。tooltip（{
content：function（）{
var element = $（this）;
return element.attr（'title'）
}
}）;
}）;
演示： Plunker
I have created a jQuery Tooltip on html page. I want to show a tooltip with html content inside on a hyperlink. But the jQuery Tooltip just show all html text as normal text inside the tooltip but does not have the html format. There is an example of jQuery Tooltip.
<head>
<title>jQuery Tooltip</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script>
$(function() {
$(document).tooltip();
});
</script>
<style>
label {
display: inline-block;
width: 5em;
}
</style>
</head>
<body>
<a href="#" title="<font color='#FF0000'>That's what this widgets</font>">Tooltips</a>
</body>
The tooltip, instead of showing the text "That's what this widgets" in Red color, it shows "<font color='#FF0000'>That's what this widgets</font>". The html format does not apply on the tooltip text. It seem that the tooltip doesn't recognize the html format. The problem seem to be the style on tooltip is not correct or may be the jQuery tooltip doesn't support for html content.
I want to know why my jQuery tooltip cannot show html content? I need some help on my issue.
Use the content option provided by tooltip
$(function(){
$('[title]').tooltip({
content: function(){
var element = $( this );
return element.attr('title')
}
});
});
Demo: Plunker
这篇关于为什么jQuery Tooltip不显示html内容？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
