Getting jQuery for loop printing my function by incrementing values

Question

I am dealing with strange issue, but that should be a simple solution as my mind totally stuck I don't know where I am going wrong, simply I want to put my function thrice as shown below in example:

If my function is :

function(){
    if (jQuery('#gallery-v').length) {
        var $container = jQuery('#gallery-v');
        alert($container);
        $container.imagesLoaded( function(){
            $container.isotope({
                filter: '*',
                animationOptions: {
                    duration: 750,
                    easing: 'linear',
                    queue: false
                }
            });
        });
        jQuery('#filterlist_v a').click(function() {
            alert(this);
            jQuery('#filterlist_v .current').removeClass('current');
            jQuery(this).addClass('current');

            var selector = jQuery(this).attr('data-filter');
            $container.isotope({
                filter: selector,
                animationOptions: {
                    duration: 750,
                    easing: 'linear',
                    queue: false
                }
            });
            return false;
        });
    }
}

I simply want it to be two times more by just incrementing my selector value like '#gallery-v' to '#gallery-v1' and for '#filterlist_v a' to '#filterlist_v1 a' just simply increment my gallery-v by 1 in first iteration 2 in second and so on etc ...

Here is my code which I tried:

var count = 2;
for(var i = 0; i < count; i++){
 function(){
        if (jQuery('#gallery-v' +i +'').length) {
            var $container = jQuery('#gallery-v' +i +'');
            alert($container);
            $container.imagesLoaded( function(){
                $container.isotope({
                    filter: '*',
                    animationOptions: {
                        duration: 750,
                        easing: 'linear',
                        queue: false
                    }
                });
            });
            jQuery('#filterlist_v' +i +' a').click(function() {
                alert(this);
                jQuery('#filterlist_v +i +' .current').removeClass('current');
                jQuery(this).addClass('current');

                var selector = jQuery(this).attr('data-filter');
                $container.isotope({
                    filter: selector,
                    animationOptions: {
                        duration: 750,
                        easing: 'linear',
                        queue: false
                    }
                });
                return false;
            });
        }
    }
}

but its not printing my code in my js file as I wanted :( what's going on wrong please ???

jonzee · Accepted Answer · 2016-10-21 07:50:18Z

1

In your html code you should change id's of elements to #gallery-v0 and #filterlist_v0 because in the first loop (i === 0) you get selectors:

'#gallery-v' + i + '' -> #gallery-v0
'#filterlist_v0' + i + '' -> filterlist_v0

You have another error here: '#filterlist_v +i +' .current', it should be '#filterlist_v' + i + ' .current'. Assuming that first part of code works, that would be works.

edited Oct 21, 2016 at 7:50

answered Oct 21, 2016 at 7:42

jonzee

1,60913 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

laraib Over a year ago

I could not underswtand your words

laraib Over a year ago

errors will be removed for sure, but you have not gotten my point I think this thing (jQuery('#gallery-v' +i +'').length) should become (jQuery('#gallery-v0').length) in first iteration and (jQuery('#gallery_v1').length) in second iteration and so on etc ... i just want to get those selectors from my html page which are living there

laraib Over a year ago

and why should i change my id's ? any issue for that ? as I am getting i value in the loop with out any issue

jonzee Over a year ago

Ok, I thought that you have element with id #gallery-v in your code and try to get it with this loop, so what is the problem? Is the first part of code working?

laraib Over a year ago

I have #gallery-v0, #gallery-v1, #gallery-v2 in my html ... but I want to have function which filters those html based on each id ... i mean function for every individual item from html like a function for #gallery-v0, then 1 function for #gallery-v1 and last for #gallery-v2 etc ... hope you get it now

|

Collectives™ on Stack Overflow

Getting jQuery for loop printing my function by incrementing values

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related