user1063287
user1063287

Reputation: 10869

How to get the text within a span in a tooltip via jQuery?

I am trying to get the text within a span to be the 'content' of a tooltip using the Tooltipster jQuery plugin.

A description of the available parameters for the 'content' option can be seen here:

http://calebjacob.com/tooltipster/#options

JQuery

<script type="text/javascript">
$(document).ready(function() {
$('.tooltip').tooltipster({
content: $(this).parent().text() // trying to get the span text here
});
});
</script>

HTML

<p>Here is some text, and here is <span class="tooltip" data-rlink="<a href=&quot;http://www.google.com&quot;>a link</a>">SOME MORE</span> text.</p>
<p>And the content should be <span class="tooltip">UNIQUE</span> to the instance.</p>

jsFiddle

http://jsfiddle.net/rwone/y9uGh/1/

Solution

Based on the answer below, this was the implementation I went with. The snippet below shows integration of the js solution with the plugins parameters:

<script type="text/javascript">
$(document).ready(function() {
$('.tooltip').tooltipster({
functionBefore: function(origin, continueTooltip){
origin.tooltipster('update', $(origin).text());
continueTooltip();
},
animation: 'grow',
arrow: false,
});
});
</script>

Upvotes: 0

Views: 1239

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388326

Try

$(document).ready(function() {
    $('.tooltip').tooltipster({
        functionBefore: function(origin, continueTooltip){
            origin.tooltipster('update', $(origin).text());
            continueTooltip();
        }
    });
});

Demo: Fiddle

Upvotes: 1

Related Questions