Question

I have to find the next image, based on the current image path. It’s for some customized lightbox and jquery 1.3.2. My html:

<div id="feat_screenshots">
    <a class="lightbox" href="/images/features/1.gif"><img title="Image 1" alt="Image 1" src="/images/features/1.gif"></a>
    <a class="lightbox" href="/images/features/2.gif"><img title="Image 2" alt="Image 2" src="/images/features/2.gif"></a>
    <a class="lightbox" href="/images/features/3.gif"><img title="Image 3" alt="Image 3" src="/images/features/3.gif"></a>
</div>

and my javascript:

$(document).ready(function(){
    $("a.lightbox").click(function(){
        var img_src = $(this).attr("href");
        getNextImage(img_src);
    });
}

function getNextImage(curPath)
{
    var $picset = $("a.lightbox");
    alert($($picset).find("img[src=\'/images/features/1.gif\']").attr("title"));
    alert($($picset).find("img[src$=\'/images/features/1.gif\']").attr("title"));
    alert($($picset).find("img[src=curPath]").attr("title"));
    alert($($picset).find("img[src$=curPath]").attr("title"));
/*
    to be continued...
*/
}

I’m just trying to figure out what works and what not. I’m using .attr(“title”) here only for debugging to test which picture i found.

If i pass in ‘/images/features/1.gif’ to getNextImage() only the 2nd alert returns the correct title; all the others come back as ‘undefined’.

So my question is: What is the correct syntax to use my variable curPath here to get an element? Nothing i tried works.

Answer 1

curPath is a variable, so you need to concatenate it to the selector

$($picset).find("img[src='" + curPath + "']").attr("title")