最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

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

programmeradmin1浏览0评论

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)!

Share Improve this question edited Feb 17, 2012 at 23:39 Edmundo Santos asked Feb 17, 2012 at 23:06 Edmundo SantosEdmundo Santos 6134 silver badges19 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

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();
    }
});
发布评论

评论列表(0)

  1. 暂无评论