javascript jQuery 工具 -> 工具提示销毁方法?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4879983/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 15:13:04  来源:igfitidea点击:

jQuery Tools -> Tooltip destroy method?

javascriptjqueryjquery-toolstooltipdestroy

提问by redcloud1800

I am using Flowplayer's jQuery Tools framework (specifically the tooltips plugin) in a table, in addition to jQuery UI calendar.

除了 jQuery UI 日历之外,我还在表格中使用 Flowplayer 的 jQuery 工具框架(特别是工具提示插件)。

Each row of the table has the ability to insert a row above and below it.

表格的每一行都可以在其上方和下方插入一行。

When doing this I am cloning the clicked object (events and objects) and inserting it directly above or below.

这样做时,我克隆了单击的对象(事件和对象)并将其直接插入到上面或下面。

After adding a new row, I refresh the table, generating new id's for my elements, reinitializing the datepicker, and attempting to reinitialize the tooltip.

添加新行后,我刷新表,为我的元素生成新 ID,重新初始化日期选择器,并尝试重新初始化工具提示。

I am searching for a way to destroy it altogether from the instance and reapply it.

我正在寻找一种从实例中完全销毁它并重新应用它的方法。

I am looking for something similar to the datepicker('destroy')method.

我正在寻找类似于该datepicker('destroy')方法的东西。

$j($editRow).find('input.date').datepicker('destroy').datepicker({dateFormat: 'mm-dd-yy', defaultDate : defaultDateStr});

$j($editRow).find('input.date').datepicker('destroy').datepicker({dateFormat: 'mm-dd-yy', defaultDate : defaultDateStr});

I have already attempted to :

我已经尝试过:

  1. to unbind the mouseover and focus events : when reinvoking tooltip, it automatically goes for the object it was made from.

  2. hide the tooltip DOM element, remove the tooltip object from the target, and reapply it. The same thing happens as (1)

  1. 解除鼠标悬停和焦点事件的绑定:当重新调用工具提示时,它会自动转到它所在的对象。

  2. 隐藏工具提示 DOM 元素,从目标中移除工具提示对象,然后重新应用它。同样的事情发生在(1)

Is there way I can create a destroy method myself?

有没有办法自己创建一个销毁方法?

采纳答案by Tom Halladay

I tried kwicher's method, and could not get it to work. Although I was trying to alter the minified code, and I'm not entirely sure I found the right place to make the change.

我尝试了 kwicher 的方法,但无法让它发挥作用。尽管我试图更改缩小后的代码,但我并不完全确定我找到了进行更改的正确位置。

I did, however, get this to work. ValidationFailed is a class I am applying to all the input fields that are also having tooltips applied to them.

但是,我确实让它起作用了。ValidationFailed 是我应用于所有输入字段的类,这些输入字段也应用了工具提示。

$('.validationFailed').each(function (index) {
    $(this).removeData('tooltip');
});

$('.tooltip').remove();

I tried this several different ways, and this was the only combination that allowed me to add additional tool tips post-removal, without preventing the new tooltips from working properly.

我尝试了几种不同的方法,这是唯一一种允许我在删除后添加其他工具提示而不妨碍新工具提示正常工作的组合。

As best I can tell, the tooltip class removal handles getting rid of the actual tooltip divs, whose events are also wired up directly. The .removeData allows the tooltip to be re-bound in the future.

据我所知,工具提示类删除处理摆脱实际的工具提示 div,其事件也直接连接。.removeData 允许工具提示在未来重新绑定。

回答by Mark

Building on your ideas and Tom's answer, I found that three things are necessary:

根据您的想法和 Tom 的回答,我发现需要做三件事:

  1. remove the 'tooltip' data from the tooltip target element
  2. unbind event listeners from the tooltip target element
  3. remove the element (assuming you're using this tooltip approach to allow for arbitrary HTML in your tip)
  1. 从工具提示目标元素中删除“工具提示”数据
  2. 从工具提示目标元素取消绑定事件侦听器
  3. 删除元素(假设您正在使用此工具提示方法来允许在您的提示中使用任意 HTML)

So, this simple function should do the trick. Just pass it a jQuery object containing the target elements of the tooltips you want to destroy.

所以,这个简单的函数应该可以解决问题。只需传递一个包含您要销毁的工具提示的目标元素的 jQuery 对象即可。

function destroyTooltips($targets) { 
    $targets.removeData('tooltip').unbind().next('div.tooltip').remove();
}

回答by kwicher

If you still need it you can do as follows: - in the tooltip implementation file add the following function

如果您仍然需要它,您可以执行以下操作: - 在工具提示实现文件中添加以下功能

destroy: function(e) {
        tip.detach();
        }

somewhere in :

某处:

$.extend(self, {
...

I have after the last native function.

我在最后一个本机功能之后。

Then when you want to remove the tip, fire:

然后当你想取下尖端时,开火:

$(.tip).data('tooltip').destroy();

It should do the trick

它应该可以解决问题

K

回答by Jaskey

   if($element.data('ui-tooltip')) {//if tooltip has been initialized
       $element.tooltip('destroy');
   }

回答by Pedro Ferreira

Maybe it's too late... ;-)
But here you can find all methods of 'tooltip': http://www.w3schools.com/bootstrap/bootstrap_ref_js_tooltip.asp

也许为时已晚...... ;-)
但是在这里您可以找到“工具提示”的所有方法:http: //www.w3schools.com/bootstrap/bootstrap_ref_js_tooltip.asp

I leave the tip for someone who could pass by, having the same problem: dealing with different 'tooltip' actions/objs.

我将提示留给可能经过的人,遇到同样的问题:处理不同的“工具提示”操作/对象。