当前我从数据库中输出一个文本，代码如下：
if ($data["own_subject"][$x]!="") { <td><p>".$data["own_subject"][0]."</p></td> }
我发现一个JS函数只显示前10个字符，一旦有人将鼠标悬停在上面，整个文本就会出现。此功能适用于以下代码，并且运行良好：
<script>
var lengthText = 10;
var text = $('p').text();
var shortText = $.trim(text).substring(0, lengthText).split(" ").slice(0, -1).join(" ") + "...";
$('p').text(shortText);
$('p').hover(function () {
$(this).text(text);
}, function () {
$(this).text(shortText);
});
</script>
现在我不喜欢结果的风格，我想在某种工具提示中显示全文。我使用的是bootstrap，bootstrap有这个功能。我现在的问题是，我不知道如何更改JS代码，以便在工具提示中显示完整的文本。有人能帮我看看我需要如何更改当前代码吗？
我真的很感谢你的任何帮助。
谢谢，Chris
- 在
p标签的title属性中添加您原来的text，我希望您已经在做了 - 将
data-toggle="tooltip" data-placement="top"属性添加到p标记
Ex
<p data-toggle="tooltip" data-placement="top" title='".$data["own_subject"][0]."'>".$data["own_subject"][0]."</p>
- 以
$('[data-toggle="tooltip"]').tooltip()的身份启动。您现在还可以删除$('p').hover事件
Ex
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
您可以使用引导的工具提示来完成此操作
<button id="test" type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom">
底部上的工具提示
$(function() {
var lengthText = 10;
var text = $('#test').text();
var shortText = $.trim(text).substring(0, lengthText).split(" ").slice(0, -1).join(" ") + "...";
$('#test').prop("title", text);
$('#test').text(shortText);
$('[data-toggle="tooltip"]').tooltip();
})
http://plnkr.co/edit/5hHRjULpDlMP3cYhHhU4?p=preview
使用title尝试简单的html工具提示。
if ($data["own_subject"][$x]!="") { <td><p title='".$data["own_subject"][0]."'>".$data["own_subject"][0]."</p></td> }
您可以将带有实际文本的title属性添加到元素中，并在这些元素上调用bootstraps tooltip init，还需要从脚本中删除当前的hover处理程序
$('p').text(shortText);
// Add title with real text to your element
$('p').attr('title', text);
// And all in document ready bootstrap tooltip init for your short text tags
$( document ).ready(function() {
$('p').tooltip();
});
点击此处查看更多关于boosrap收费提示的信息：http://www.w3schools.com/bootstrap/bootstrap_ref_js_tooltip.asp