Question

Hi i am using this code:

    jQuery(document).ready(function(){
var number = 1;
///////////////////////////////////////////////////
    /* The button to see the single portfolio items */
jQuery('.cover a').unbind("click").click(function (coverclick){

    coverclick.preventDefault();
    coverclick.stopPropagation();
    coverclick.stopImmediatePropagation();
    number ++;
    /* Get the link */
    var coverlink = jQuery(this).attr('href');
    jQuery('.loadmask').show();
    jQuery('.loadmask-msg').show();
    jQuery('.upperdiv').animate({height : 'hide', opacity : 'hide', easing:   'EaseOutBounce'},'slow', function(){                                      jQuery('.upperdiv').html('');});
    jQuery('.upperdiv').load(coverlink+' .loading_div');
    jQuery('.upperdiv').ajaxComplete(function() {
        var  slideClass = 'all_project_images' + number;
        var  dentroClass = '.' + slideClass;
        jQuery('html,body').stop().animate({
                    scrollTop: jQuery(this).offset().top},
                    'slow');
        jQuery('.post_nav_portfolio').show();
        jQuery('.slideshow ul').removeClass().addClass(slideClass);
        jQuery(dentroClass).stop(false,true).responsiveSlides({
                    auto: true,
                    nav: true,
                    speed: 500});   
        jQuery('.upperdiv').animate({height : 'show', opacity : 'show', easing: 'EaseInBounce'},'slow');
        jQuery('.loadmask').hide();
        jQuery('.loadmask-msg').hide();
        jQuery('.cover').hover(function(){
                jQuery(this).children('.mimo_portfolio_image').stop().animate({opacity : 0.5},'fast');
                    }, function(){
                jQuery(this).children('.mimo_portfolio_image').stop().animate({opacity : 1},'fast');
                    }); 
        jQuery("a[rel^='prettyPhoto']").prettyPhoto();
        jQuery('.slideshow').hover(function(){
                jQuery(this).children('.rslides_nav').show('slow');
                }, function(){
                jQuery(this).children('.rslides_nav').hide('slow');
            });
            console.log(dentroClass);

            });

    return false;

});

    });

to load and show a portfolio item, it loads and works great but i have a duplicating problem, with the
console.log(dentroClass);

i can see that first click it log 1 time the variable, second click logs 2 times, 3 click log 3 times, well all the functions repeats the number of the click, if it is fifth click it repeats 5 times the function.

I have been working with on(); and OFF(); and bind(); unbind(); but nothing works.

Answer 1

I’m guessing that you are binding new ajaxComplete and hover handlers every time you click.

you should move all of those bindings to outside the click function. (so that they will run only once.)

or unbind everything at the beginning of each click.