HTML's data attribute undefined in jQuery
I'm using the following code to access an HTML data attribute:
HTML
<p class="add-favorites-to-list">
<a href="#" data-baskettype="order"><img src="/style/icons/cart_add.png"> Test1</a>
<a href="#" data-baskettype="quote"><img src="/style/icons/calculator_add.png"> Test2</a>
</p>
JS
$(document).ready(function() {
$('.add-favorites-to-list').show();
$('.add-favorites-to-list a').click(function() {
alert($(this).data('baskettype'));
return false;
});
});
CSS
.add-favorites-to-list { display: none; }
Example: http://jsfiddle.net/mR8gK/1/
Which works fine on jsFiddle, however it doesn't work in my site (with the same code and the same browser). I get an undefined
in the alert()
.
I've checked if jQuery finds the element and it does, because: console.log($(this).html());
shows the contents of the element.
Is there any (obvious) reason why that code wouldn't work in my site but does work on jsFidd开发者_高级运维le?
What version of jQuery are you running? Because if you drop it below 1.4.4
it comes back as undefined.
精彩评论