get custom attribute value in jquery

Question

i have two span's and where i have a custom attribute. I want to get the value of it by clicking <a>.Here is my html

<span data="<?php echo $key; ?>"><?php echo $answer['vote']; ?></span>
<a href="#" class="tup" rel="<?php echo $answer['id']; ?>"><span class="glyphicon glyphicon-thumbs-up design-thumbs" id="thumbs-up-ico"></span></a>

Jquery

$(document).ready(function() {                       
$( ".tup" ).click(function(event) {
    event.preventDefault();
    var key = $('span').attr('data');
    alert(key);
});

Here i get undefined in alert.Where is my error?Thanks

Anton · Accepted Answer · 2014-02-05 10:46:41Z

5

You are most likley getting undefined because you are not selecting the wanted span, use .prev() to select it

$( ".tup" ).click(function(event) {
    event.preventDefault();
    var key = $(this).prev().attr('data');
    //               ^^^^^^^^
    alert(key);
});

answered Feb 5, 2014 at 10:46

Anton

32.6k5 gold badges47 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

zeeks Over a year ago

@andDev since this is the correct answer, then click the grey tick to make it green :)

Alessandro Minoccheri · Accepted Answer · 2014-02-05 10:45:55Z

3

you need to use data-key(or another value, data-id, data-attr....) and retrieve it in jQuery with .data(key)
You need to get the previous element with prev() try this:
HTML

<span data-key="<?php echo $key; ?>"><?php echo $answer['vote']; ?></span>

jQuery

$(document).ready(function() {                       
$( ".tup" ).click(function(event) {
    event.preventDefault();
    var key = $('span').prev().data('key');
    alert(key);
});

answered Feb 5, 2014 at 10:45

Alessandro Minoccheri

36.1k22 gold badges128 silver badges176 bronze badges

Comments

folibis · Accepted Answer · 2014-02-05 10:55:38Z

0

Storing data in this way is not valid. You can use html5 data-* propery for custom attribute, for example:

<!DOCTYPE html>
...
<span data-key="some data">value</span>
<script>
var key = $("span").data("key");
</script>

answered Feb 5, 2014 at 10:55

folibis

12.9k7 gold badges71 silver badges116 bronze badges

Collectives™ on Stack Overflow

get custom attribute value in jquery

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related