Passing constructed variable to plugin

Question

I am stuck trying to construct and pass an array to a plugin.

The plugin expects this and works if i explicitly give valid image urls here :

$( '#gallery' ).click( function( e ) {
    e.preventDefault();
    $.swipebox( [
        { href:'big/image1.jpg', title:'My Caption' }, 
        { href:'big/image2.jpg', title:'My Second Caption' }
    ] );
} );

So i figured i could do the below to construct a string variable of the images i actually want to use. The output looks correct when i look at in in that append test you see here, but it does not work :

var thisarray = "";
$('#%id% #gallery img').each(function(){
    var thisimageurl = $(this).attr("src");
    var thisimagetitle = $(this).attr("title");
    var thisitem = "{ href:'" + thisimageurl + "', title:'" + thisimagetitle + "' },";
    thisarray += thisitem;
});

$('#%id%').append(thisarray); // looks like it should


$( '#gallery' ).click( function( e ) {
    e.preventDefault();
    $.swipebox(
        [thisarray]
    );
} );

Cant i not pass a constructed string like this to the plugin.?

Answer 1

Try that instead:

var thisarray = [];

And push object inside each loop:

thisarray.push({ href: thisimageurl, title: thisimagetitle });

Then call plugin:

$.swipebox(thisarray);