0

I just want to toggle some elements when a link is clicked:

This is how i am trying (But i don't really think that it matters much for this question what's inside the event function callback):

/* mostrar exceso de comentarios a peticion del usuario*/
$('.toggleComments').click(function(){
        console.log('.toggleComments');
        if($(this).parents('.helpContent').find('.commentHideble:visible').length > 0){
            $(this).text('+ <?=get_texto_clave('show_old_comments')?>').removeClass('toggleCommentsActive').append(' ('+$(this).parents('.helpContent').find('.commentHideble:not:visible').length+'+)');
        }else{
            $(this).text('- <?=get_texto_clave('hide_old_comments')?>').addClass('toggleCommentsActive');
        }
        $(this).parents('.helpContent').find('.commentHideble').slideToggle(100);

});

I even tried a boolean but gave me same result

/* mostrar exceso de comentarios a peticion del usuario*/


var ctoggle = false;
$('.toggleComments').click(function(){
    if(ctoggle == false){
        ctoggle = true;
        console.log('.toggleComments');
        if($(this).parents('.helpContent').find('.commentHideble:visible').length > 0){
            $(this).text('+ <?=get_texto_clave('show_old_comments')?>').removeClass('toggleCommentsActive').append(' ('+$(this).parents('.helpContent').find('.commentHideble:not:visible').length+'+)');
        }else{
            $(this).text('- <?=get_texto_clave('hide_old_comments')?>').addClass('toggleCommentsActive');
        }
        $(this).parents('.helpContent').find('.commentHideble').slideToggle(100);
        ctoggle = false;
    }
});

Why the log is being fired twice by click?

4

3 回答 3

1

看起来您在页面中有两次相同的 jQuery 块。两次绑定=两次火灾。

第 499 和 1481 行。

于 2012-09-01T21:35:22.753 回答
0

由于您使用的是类选择器，因此单击事件不太可能在多个元素上冒泡/传播，所有元素都与toggleComments类有关。e.stopPropagation()应该对你的情况有所帮助。

preventDefault停止单击本身，因此如果元素是超链接，最好不要使用该方法。如果它只是一个 div、span 或其他什么，你总是可以返回 false。在 jQuery 中，返回 false 会停止事件传播/冒泡并防止默认值。

于 2012-09-01T21:33:26.667 回答
0

一个 jsfiddle 页面可能会有所帮助，但同时你可以试试这个：

$('.toggleComments').click(function(e){

    e.stopPropagation(); 

    console.log('.toggleComments');
    if($(this).parents('.helpContent').find('.commentHideble:visible').length > 0){
        $(this).text('+ <?=get_texto_clave('show_old_comments')?>').removeClass('toggleCommentsActive').append(' ('+$(this).parents('.helpContent').find('.commentHideble:not:visible').length+'+)');
    }else{
        $(this).text('- <?=get_texto_clave('hide_old_comments')?>').addClass('toggleCommentsActive');
    }
    $(this).parents('.helpContent').find('.commentHideble').slideToggle(100);
}
于 2012-09-01T21:26:32.127 回答