jQuery .tooltip() 不是函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9394390/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
.tooltip() is not a function
提问by David
I am trying to use the .tooltip() that I found from the following: Jquery-ui tooltip. What I have is a rails app that has some information in a table. In separate cells. Currently you can view the full information of a cell by clicking it which opens up jquery dialog which works fine. What I am trying to add to it is so that there will be two options.
我正在尝试使用从以下内容中找到的 .tooltip()：Jquery-ui tooltip。我拥有的是一个在表格中包含一些信息的 rails 应用程序。在单独的单元格中。目前，您可以通过单击单元格来查看单元格的完整信息，这会打开工作正常的 jquery 对话框。我要添加的内容是，将有两种选择。
1) Click the cell which brings up jquery dialog - which works already
2) Or hover a cell which shows an overview.
1）单击显示jquery对话框的单元格 - 已经可以使用了
2) 或将鼠标悬停在显示概览的单元格上。
From the image currently you have a booking that you can click on and it will show the booking information. However I am trying to extend it so that the user has the option of clicking to view the information or hovering over the cell to view the information.
从目前的图像中，您有一个预订，您可以点击它，它会显示预订信息。但是我正在尝试扩展它，以便用户可以选择单击以查看信息或将鼠标悬停在单元格上以查看信息。
What is the best way to do this? I have the following code which works with and brings up the dialog. I tried adding:
做这个的最好方式是什么？我有以下代码可以使用并调出对话框。我尝试添加：
<td class="<%= booking.status %>" onmouseover='$("#booking<%= booking.id %>").tooltip()'>
before which didn't work, and I probably understand that it wouldn't work because there would be a conflict between the two. In addition to this I did try using simpletip and qtip but seemed to not have no luck. Is what I am trying to do not feasible.
之前它不起作用，我可能明白它不起作用，因为两者之间会发生冲突。除此之外，我确实尝试使用 simpletip 和 qtip，但似乎没有运气。是我试图做的不可行。
<td class="<%= booking.status %>" onclick='$("#booking<%= booking.id %>").dialog()'>
<center>
<%= booking.reference_number %>
<% if current_user.is_booking_manager? %>
(<%= booking.company_name %>)
<% end %>
</center>
<div style="display:none;">
<% if not booking.provisional? or current_user.is_booking_manager? %>
<div id="booking<%= booking.id %>" title="Booking Information">
<% else %>
<div id="booking<%= booking.id %>" title="Edit Booking">
<% end %>
<%= render :partial => "booking_dialog", :locals => { :booking => booking } %>
</div>
</div>
</td>
采纳答案by Amar Palsapure
Try doing something like this. For tooltip to work, you will require titleset for the control.
尝试做这样的事情。要使工具提示起作用，您需要title设置控件。
HTML
HTML
<td id="bookingTd" title="This is a tooltip."
class="<%= booking.status %>"
onclick='$("#booking<%= booking.id %>").dialog()'>
</td>
JavaScript
JavaScript
$(document).ready(function(){
$("#bookingTd").tooltip();
});
Also make sure you load jQuery first and then the tooltip plugin.
还要确保首先加载 jQuery，然后加载工具提示插件。
Hope this helps you.
希望这对你有帮助。
回答by dtmiRRor
I got rid of the error by adding the boostrap libs & css
我通过添加 boostrap 库和 css 摆脱了错误
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
回答by teshnizi
In case you are using Bootstrap 4, use .min.jsjquery file in place of .slim.min.jsfile:
如果您使用的是 Bootstrap 4，请使用.min.jsjquery 文件代替.slim.min.js文件：
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
