将jquery对象链接/取消链接到元素
我正在使用jquery flowplayer工具插件http://flowplayer.org/tools/tooltip.html
1）我想在用户点击元素时创建工具提示。
2）当用户点击另一个元素时，旧的工具提示必须取消链接（删除）
3）应为所单击的元素创建（或旧移动到）新的工具提示
4）因此，页面上应该<= 1个工具提示
你能帮我么？
这是代码，它独立运行
jQuery tooltip /******* THIS FUNCTION IS JUST FOR TEST, REMOVE IT LATER *********/ $(document).ready(function() { $("#_2").tooltip({ effect: "slide", tip: '.tooltip' , position: 'bottom center' }); }); /******* THIS FUNCTION IS JUST FOR TEST, REMOVE IT LATER *********/ /** The code below is not working as I expect, it doesn't MOVE tooltip **/ var old_id; //first time - create tooltip function my_create(id){ $("#"+id).tooltip({ effect: "slide", tip: '.tooltip', position: 'bottom center' }); } //next times - move tooltip to other element function my_unlink(id){ $("#"+id).unbind("mouseover"); //todo } function my_link(id){ //todo } //THE MAIN FUNCTION function do_tip(new_id){ if(old_id){ my_unlink(old_id); my_link(new_id); alert(new_id); } else my_create(new_id); old_id=new_id; //new_id.focus(); } .tooltip { display: none; background:transparent url(http://sofzh.miximages.com/javascript/black_arrow_bottom.png); font-size:14px; height:70px; width:160px; padding:25px; color:#fff; } h1 { width: 400px; text-align: center; background-color: yellow; } John
Mary
Dan
Paul
Kim
There should be only one tooltip on a page! jQuery tools tooltip支持定义触发工具提示的事件。
您不需要自己处理click事件。
编辑：更新了脚本。 单击链接将工具提示始终移动到第二个元素。
这是脚本
var tt = $("h1").tooltip({ events:{def:'click, click'}, effect: "slide", tip: '.tooltip' , position: "bottom center", api: true, delay: 30000 }); $("#ht").click(function() { tt.hide(); $("#_2").tooltip().show(); });
整个剧本
JS Bin John
Mary
Dan
Paul
Kim
Click here There should be only one tooltip on a page!
FlowPlayer工具提示具有在每次调用tooltip返回的API。
然后，您可以在API对象上调用hide 。
这是您的代码应该是什么样子：
var old_id, API; //first time - create tooltip function my_create(id){ API = $("#"+id).tooltip({ effect: "slide", tip: '.tooltip', position: 'bottom center' }); } //next times - move tooltip to other element function my_unlink(id){ API.unbind("mouseover"); //todo } function my_link(id){ my_create( id ); } //THE MAIN FUNCTION function do_tip(new_id){ if(old_id){ my_unlink(old_id); my_link(new_id); alert(new_id); } else my_create(new_id); old_id=new_id; //new_id.focus(); }
这个替代解决方案怎么样？
jQuery tooltip John
Mary
Dan
Paul
Kim
There should be only one tooltip on a page!