Question

I developed an image gallery using a jQuery plugin. Now I need to select an attribute value of a selected image. For this I used the following code.

var img=$('li.selected');
var comm = $("textarea#comm").val();
var dataid=$(img).attr('data-id');
var dataalid=$(img).attr('data-alid'); 

and in html page the selected list is:

<li class="selected" style="margin-right: 3px; width: 69px;">

That is following list:

<div class="es-carousel" id="loader">
<ul class="es-carousel">
<li><a href="#"><img src="data:image/jpeg;base64,/9j/4AAQSwAEASSlPA47U..../9kA"  alt="xyz" data-description="Retrieving images with jquery and servlet" data-id="1" data-alid="6"/></a></li>
 ...
</div>

I need to get the value of data-id and data-alid. I don’t know how to get the value. I’m newbie in jQuery.

Please anyone help me. Thanks.

Answer 1

When doing this:

var img=$('li.selected');

You are selecting the LI element, not the IMG. You should do it like this:

var img = $('li.selected img');

Furthermore, you don’t need to wrap the img in jQuery again, just do:

var dataid = img.attr('data-id');

Or even:

var dataid = img.data('id');