如何使用 jQuery 在浏览器中禁用工具提示?

问题描述

有没有办法在将鼠标悬停在填充了标题"属性的元素上时禁用浏览器工具提示?请注意，我不想删除标题内容.这是请求的代码:

Is there a way to disable browser tooltip from displaying when hovering over elements that have attribute 'title' populated? Note that I don't want to remove title content. Here is the code are requested:

  $(document).ready(function() {
     $('a.clickableSticky').cluetip({
         splitTitle: '|',
         showTitle: false,
         titleAttribute: 'description',
         activation: 'click',
         sticky: true,
         arrows: true,
         closePosition: 'title'
     });
 });

在 asp.net 中

and in asp.net

  <ItemTemplate>
     <a class="clickableSticky" href="#"
     title=' <%#((Limit)Container.DataItem).Tip %>'>
     <img src="..App_Themesdefaultimagesiconsinformation.png"/>
     </a>

 </ItemTemplate>

推荐答案

您可以在页面加载时删除 title 属性.

You could remove the title attribute on page load.

$(document).ready(function() {
    $('[title]').removeAttr('title');
});

如果以后需要用到标题，可以将其存储在元素的jQuery data()中.

If you need to use the title later, you can store it in the element's jQuery data().

$(document).ready(function() {
    $('[title]').each(function() {
        $this = $(this);
        $.data(this, 'title', $this.attr('title'));
        $this.removeAttr('title');
    });
});

另一种选择是将 title 属性的名称更改为 aTitle，或者浏览器会忽略的其他名称，然后更新任何 JavaScript 以读取新属性名称而不是 title.

Another option is to change the name of the title attribute to aTitle, or something else that the browser would ignore, and then update any JavaScript to read the new attribute name instead of title.

更新:

您可以使用的一个有趣的想法是在将鼠标悬停在元素上时懒惰地"删除标题.当用户将鼠标悬停在元素上时，您可以将标题值放回去.

An interesting idea you could use is to "lazily" remove the title when hovering over an element. When the user hovers off the element, you can then put the title value back.

这并不像应有的那么简单，因为如果您将 title 属性设置为 null 或删除 title 属性，IE 不会正确删除悬停事件上的工具提示.但是，如果您在悬停时将工具提示设置为空字符串 ("")，它将从包括 Internet Explorer 在内的所有浏览器中删除工具提示.

This isn't as straightforward as it should be because IE doesn't correctly remove the tooltip on the hover event if you set the title attribute to null or remove the title attribute. However, if you set the tooltip to an empty string ("") on hover, it will remove the tooltip from all browsers including Internet Explorer.

您可以使用我上面提到的方法将title属性存储在jQuery的data(...)方法中，然后将其放回mouseout.

You can use the method I mentioned above to store the title attribute in jQuery's data(...) method and then put it back on mouseout.

$(document).ready(function() {
    $('[title]').mouseover(function () {
        $this = $(this);
        $this.data('title', $this.attr('title'));
        // Using null here wouldn't work in IE, but empty string will work just fine.
        $this.attr('title', '');
    }).mouseout(function () {
        $this = $(this);
        $this.attr('title', $this.data('title'));
    });
});

这篇关于如何使用 jQuery 在浏览器中禁用工具提示?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持html5模板网！