Is there a JQuery tooltip plugin that supports HTM

2019-05-07 12:46发布

问题:

I am searching for a Tooltip plugin/library for JQuery. It should be able to automaticlly position tooltips, like TipTip, and also support HTML content for the tips.

TipTip does fullfill both conditions, but:

Added HTML support with Tip Tip. You can now add HTML into the Title attribute (though this is not recommended if you want strictly valid code).

回答1:

I believe this one does. For instance, this demo shows an image. You could easily have a bodyHandler that retrieves the HTML from an attribute on the element. For instance

<a href="whatever" data-tooltip="This is a <strong>marked up</strong> tooltip">foo</a>

That's perfectly valid HTML, and the bodyHandler would look something like

return this.attr("data-tooltip"));


回答2:

I didn't want to leave jquery native plugin and mess with additional libs, so I figured out quite simple solution:

$('.tooltips').tooltip({
        content: function(){
            return $(this).attr('title');
        }
    })

This way - your title attribute with HTML may be used successfully.



回答3:

I like TipTip a lot. The "title" field usage is awkward, but you don't have to do that:

content: string (false by default) - HTML or String to use as the content for TipTip. Will overwrite content from any HTML attribute.

(via http://code.drewwilson.com/entry/tiptip-jquery-plugin)



回答4:

This tooltip widget included in the jQuery UI library supports different automatic positions and HTML in the title attribute: http://api.jqueryui.com/tooltip/