javascript - Target only the first click in jQuery - Stack Overflow

admin管理员组

文章数量:1326328

I have this piece of code, and I need to target only the first click for one line and normal clicks for the rest.

$esCarousel.show().elastislide({
    imageW  : 240,
    onClick : function( $item ) {
        if( anim ) return false;
        anim    = true;
        // only in the FIRST CLICK click show wrapper (expected but don't work)
        _addImageWrapper();
        // on click show image
        _showImage($item);
        // change current
        current = $item.index();
    }
});

When i click the item, everything works great, but when I click again I need only the “$_showImage($item);” and not the “_addImageWrapper();”.

Can you help me? I'm really a newbie about js :(

UPDATE: When I close (close with fadeOut) It won't open again! It must be because the carousel is already been clicked… how can I “reset” the click?

$navClose.on('click.rgGallery', function( event ) {
    $('.rg-image-wrapper').fadeOut('2000');
    return false;
});

Thanks for the help, I'm learning this (I think :x)!

I have this piece of code, and I need to target only the first click for one line and normal clicks for the rest.

$esCarousel.show().elastislide({
    imageW  : 240,
    onClick : function( $item ) {
        if( anim ) return false;
        anim    = true;
        // only in the FIRST CLICK click show wrapper (expected but don't work)
        _addImageWrapper();
        // on click show image
        _showImage($item);
        // change current
        current = $item.index();
    }
});

When i click the item, everything works great, but when I click again I need only the “$_showImage($item);” and not the “_addImageWrapper();”.

Can you help me? I'm really a newbie about js :(

UPDATE: When I close (close with fadeOut) It won't open again! It must be because the carousel is already been clicked… how can I “reset” the click?

$navClose.on('click.rgGallery', function( event ) {
    $('.rg-image-wrapper').fadeOut('2000');
    return false;
});

Thanks for the help, I'm learning this (I think :x)!

• javascript
• jquery

Share Improve this question Follow edited Feb 17, 2012 at 23:39 Edmundo Santos asked Feb 17, 2012 at 23:06 Edmundo SantosEdmundo Santos 61344 silver badges1919 bronze badges 1

• regarding elastislide() -- does it matter? We can clearly see the part that should be triggered only for the first click. It doesn't matter if it's nested inside a function called "superwhatchamacallit". Would also be curious about why the downvote. A newbie is asking a question, and the answer will teach him how to track a flag. Not downvote-worthy. – Greg Pettit Commented Feb 17, 2012 at 23:33

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 8

You could set a variable outside this code:

var clickedCarousel = false;

$esCarousel.show().elastislide({
    imageW  : 240,
    onClick : function( $item ) {
        if( anim ) return false;
        anim    = true;
        // only in the FIRST CLICK click show wrapper (expected but don't work)
        if(!clickedCarousel) {
          _addImageWrapper();
          clickedCarousel = true;
        }
        // on click show image
        _showImage($item);
        // change current
        current = $item.index();
    }
});

Does this fit your need?

UPDATE: Regarding this update:

UPDATE: When I close (close with fadeOut) It won't open again! It must be because the carousel is already been clicked… how can I “reset” the click?

fadeOut() takes a callback of this form:

obj.fadeOut( [duration] [, callback] )

callback can be an inline function or a predefined one, so you could use this (inline):

$navClose.on('click.rgGallery', function( event ) {
    $('.rg-image-wrapper').fadeOut(2000,function(){
       clickedCarousel = false; // reset to false after fade out is plete
    });
    return false;
});

Does that help?

Wrap _addImageWrapper() in an if (!this.clicked) condition, then set this.clicked = true;

Add a variable to keep track of if it's already been clicked.

$(function() {
    var alreadyClicked = false;
}

$esCarousel.show().elastislide({
    imageW  : 240,
    onClick : function( $item ) {
        if( anim ) return false;
        anim    = true;
        if (!alreadyClicked) {
            alreadyClicked = true;
            _addImageWrapper();
        }
        // on click show image
        _showImage($item);
        // change current
        current = $item.index();
    }
});

本文标签： javascriptTarget only the first click in jQueryStack Overflow