Turn off jQuery UI tooltip for certain elements

2019-02-04 11:05发布

问题:

For simplicity, I'd like to enable the jQuery UI tooltip widget on all elements of the page:

Then disable it for certain elements or elements and their descendants. But this doesn't seem to work:

$(document).tooltip({ track: true });
$('#menu *[title]').tooltip({ disabled: true });

My $('#menu *[title]') selector seems to work as I expect, getting all descendant elements that have a title attribute of the #menu element.

So why isn't the disabled option working in .tooltip({ disabled: true }); to disable the tooltip on those elements? Is there another way and/or better way to accomplish this?

回答1:

Set tooltip on all elements with:

$('*').tooltip();

And disable with

$('#menu *[title]').tooltip('disable');

A la:

jsFiddle



回答2:

None of the answers above worked for me, it seems like the way to do this now is to use the items option:

$("*").tooltip({ items: ':not(.menu)' });


回答3:

None of that worked for me and it has been driving me crazy.

This is what worked for me:

$(document).tooltip({ content: function () { return $(this).not('#NoTipDiv *[title]').attr('title'); });

$('*').tootip can heavily delay your page view!



回答4:

If you use selector instead of $(document), don't forget to call that code at the right moment.

$(document).tooltip({show: false});
$(document).ready( function(){
    $('#OK_Button').tooltip({disabled: true});
});


回答5:

Perhaps $(':not(.menu *[title])').tooltip({ track: true });?



回答6:

According to jQueryUI docs as of my answer date.

$( ".selector" ).tooltip( "option", "disabled", true );



回答7:

Here is what I am doing right now..

Show tool tip for:

  • Exclude anything with class "noToolTip".
  • And then include these:
    • A elements with TITLE attribute.
    • IMG elements with ALT attribute.
    • Anything with class "toolTip" and TITLE attribute.

Here is my javascript code.

// Set up tool tips for images and anchors.
$( document ).tooltip({
   items: "img[alt], a[title], .toolTip[title], :not(.noToolTip)",
   track: true,
   content: function() {
      var element = $( this );
      // noToolTip means NO TOOL TIP.
      if ( element.is( ".noToolTip" ) ) {
         return null;
      }
      // Anchor - use title.
      if ( element.is( "a[title]" ) ) {
         return element.attr( "title" );
      }
      // Image - use alt.
      if ( element.is( "img[alt]" ) ) {
         return element.attr( "alt" );
      }
      // Any element with toolTip class - use title.
      if ( element.is( ".toolTip[title]" ) ) {
         return element.attr( "title" );
      }
   }
});


回答8:

None of the above worked for me...but this did (after initializaion):

$("#selector").tooltip("disable");