Question

On each page load i am changing a image. I found this plugin which is doing a great work.

(function($){

    $.randomImage = {
        defaults: {

            //you can change these defaults to your own preferences.
            path: '/templates/default/images/', //change this to the path of your images
            myImages: ['fab_ad1.jpg', 'fab_ad2.jpg', 'fab_ad3.jpg'] //put image names in this bracket. ex: 'harold.jpg', 'maude.jpg', 'etc'

        }           
    }

    $.fn.extend({
            randomImage:function(config) {

                var config = $.extend({}, $.randomImage.defaults, config); 

                 return this.each(function() {

                        var imageNames = config.myImages;

                        //get size of array, randomize a number from this
                        // use this number as the array index

                        var imageNamesSize = imageNames.length;

                        var lotteryNumber = Math.floor(Math.random()*imageNamesSize);

                        var winnerImage = imageNames[lotteryNumber];

                        var fullPath = config.path + winnerImage;


                        //put this image into DOM at class of randomImage
                        // alt tag will be image filename.
                        $(this).attr( {
                                        src: fullPath,
                                        alt: winnerImage
                                    });


                }); 
            }

    });



})(jQuery);

HTML:

<img class="shuffle" src="" alt="" onclick="chooseLink()">

Calling this function:

$('.shuffle').randomImage();

Using this feature i am displaying ads in my page. I having separate link for each ad image. When a image is clicked i am calling a javascript function and there i need to identify the image name and with respect to that i am redirecting to the separate link. In my case I dont know how to identify the image name which was clicked. Please suggest me how to identify the image name which was clicked.
Hope my Question is Clear.
Thanks in Advance !!!

Answer 1

Change

<img class="shuffle" src="" alt="" onclick="chooseLink()">

to

<img class="shuffle" src="">

And add this in your script :

$('.shuffle').click(function(){
    var imageId = this.src.split('/').pop(); // this is the name of your image file
                                             // It identifies the image
    // use the image 
    chooseLink(imageId);
});