Jquery, Ajax tooltip help

Question

im using a Jquery + Ajax tooltip which displays a box displaying the context thru AJAX, but the title of the tooltip box is set to be "kbay.in" and the text in the "a" tag ,, now how do i change it to display the title as the value, id, name ,or anythin else of the "a" tag , than the text in it:

    $(this).qtip(
    {
        content: {
            // Set the text to an image HTML string with the correct src URL to the loading image you want to use
            text: '<img class="throbber" src="http://www.craigsworks.com/projects/qtip/images/throbber.gif" alt="Loading..." />',
            ajax: {
                url: $(this).attr('rel') // Use the rel attribute of each element for the url to load
            },
            title: {
                text: 'Kbay.in' + $(this).name(), // Give the tooltip a title using each elements text
                button: true
            }
        },

score 0 · Answer 1 · answered Sep 28 '11 at 20:02

0

Like this?

title: {
    text: $(this).prop('value'); // this is the 'value'.. for example
}

answered Sep 28 '11 at 20:02

wanovak

6,117
25
32

score 0 · Answer 2 · answered Sep 28 '11 at 20:04

0

I THINK that you are looking for $(this).attr("name");

or $(this).attr("id");

etc etc

answered Sep 28 '11 at 20:04

Evan

5,975
8
34
63

actually no, use attr. read the actual documentation. http://api.jquery.com/prop/ vs http://api.jquery.com/attr/ – Evan Sep 28 '11 at 20:11
You want to access the DOM *property*. jQuery is shielding you from the truth in this case. – wanovak Sep 28 '11 at 21:33
lets try and make this more clear for you... http://jquery-howto.blogspot.com/2011/06/html-difference-between-attribute-and.html the only reason to use property is if the DOM element is going to be manipulated on the fly, like a checkbox "checked" or something like that. in this case, the default ATTRIBUTE remains the same. functionally, since they work the same in this case, I wouldn't tell you that you were WRONG to use prop, but you are wrong in trying to correct me to only use prop. – Evan Sep 28 '11 at 22:08

Terry · Answer 3 · 2011-09-28T20:57:15.867

Firstly, make sure $(this) is actually your "a" element so that you know you're grabbing the correct value. Once you know that for sure, the following code should help you:

<a id="mylink" class="foo" href="blah.html">Testing link text</a>

var _link = $(this);   // Helps keep track of $(this)

_link.qtip(
    {
        ...
        title: {
            text: 'Kbay.in ' + _link.text(),             // Kbay.in Testing link text
            // text: 'Kbay.in ' + _link.attr('id'),      // Kbay.in mylink
            // text: 'Kbay.in ' + _link.attr('href'),    // Kbay.in blah.html
            // text: 'Kbay.in ' + _link.attr('class'),   // Kbay.in foo
            button: true
        }
    }

$.text() and $.value() grab whatever is between your link's open and close tags without HTML as opposed to the $.html() method which returns the markup:

// $(this).text() = "Testing link text"
// $(this).html() = "Testing link text"
<a href="blah.html">Testing link text</a>             

// $(this).text() = "Testing link text"
// $(this).html() = "Testing <b>link</b> text"
<a href="blah.html">Testing <b>link</b> text</a>

Jquery, Ajax tooltip help

3 Answers3