带有动态内容的jQuery UI工具提示

我使用jQuery UI Tooltip Widget并且有代码：

$(function() {$( document ).tooltip({ content: 'connecting', content:function(callback) { $.get('teacher.php?teacherid=' + link,{}, function(data) { callback(data); }); }, })}); 

在我的页面上我有：

 
Alex Brown
 
John Black 

但它不起作用。 如何向JS发送变量，Alex Brown是ID = 1的老师，John Black是ID = 2的老师？

UPD：嗯，这是固定的

   $(function() {$( document ).tooltip({ show: 0, hide: 0, items: 'teacher', content: 'connecting', content: function(callback) { var x=$(this).attr('id') $.get('teacher.php?teacherid='+x,{}, function(data) { callback(data); }); }, })});  

在HTML中我现在有：

 Alex Brown John Black Homer Simpson 

Answer 1

首先，您使用课程标记链接

 
Alex Brown
 
John Black 

然后在该类上挂钩工具提示

 $(function() {$( ".teacher-link" ).tooltip({ content: 'connecting', content:function(callback) { var link = $(this).attr("data-teacher"); // here retrieve the id of the teacher $.get('teacher.php?teacherid=' + link,{}, function(data) { callback(data); }); }, })}); 

在非html5页面上，您可以使用标题之类的其他属性：

  var link = $(this).attr("title"); // here retrieve the id of the teacher 

Answer 2

我认为最好使用HTML5自定义属性

 
Alex Brown
 
John Black 

和脚本

 $(function() { $( ".teacher" ).tooltip({ content: function() { return $(this).attr('data-id'); }, }); }); 

您可以在以下url玩这个： http ： //jsfiddle.net/pT3ed/4/

只需替换“return $（this）.attr（’data-id’）;” 使用$（this）.attr（’data-id’）作为id的加载器。

Answer 3

你应该得到这个：

 $('body').tooltip({ selector: '[data-toggle=tooltip]' }); 

Answer 4

            
 
 link-1 
   
 link-2