jQuery Image Swap Cliquez et if/else

Question

Im coincé, Im définissant une variable quand on clique, tester puis avec si pour voir si la variable existe et faire autre chose. C'est un script simple qui je pense probablement, aimerait les pensées de quelqu'un.

$('.view-alternatives-btn').live('click', function() { 



//$("#nc-alternate-wines").scrollTo(); 
    //$('.nc-remove').toggle(); 
    var showBtn = null; 
    if (showBtn == null) { 
    $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif"); 
    $('#nc-alternate-wines').show(); 
    showBtn = 1; 
    console.log(showBtn); 
    } 
    else if (showBtn == 1) { 
    $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif"); 
    $('#nc-alternate-wines').hide(); 
    console.log("this " + showBtn); 
    } 
    return false; 
    }); 

Answer 1

La variable ne sera jamais exister lorsque vous cliquez, car il est initialisé dans la fonction, puis perdu lorsque la fonction se termine.

Si vous voulez stocker entre clics, créez en dehors du gestionnaire de clic.

var showBtn = null; 

    $('.view-alternatives-btn').live('click', function() { 

    //$("#nc-alternate-wines").scrollTo(); 
    //$('.nc-remove').toggle(); 

    if (showBtn == null) { 
     $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif"); 
     $('#nc-alternate-wines').show(); 
     showBtn = 1; 
     console.log(showBtn); 
    } 
    else if (showBtn == 1) { 
     $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif"); 
     $('#nc-alternate-wines').hide(); 
     console.log("this " + showBtn); 
    } 
    return false; 
    }); 

Answer 2

Vous êtes toujours la mise à null lorsque le bouton est cliqué, vous ne serez jamais atteindre le else if ...

Vous pourriez plutôt utiliser une variable globale ou $.data()

Answer 3

showBtn est une variable locale, sa valeur n'est donc pas conservée dans les événements click.

Déplacer var showBtn = null; en dehors du gestionnaire click.

Cependant, la meilleure façon de le faire est d'appeler jQuery de toggle method. (Sauf que toggle ne peut pas être utilisé avec live)

Answer 4

Vous déclarez showBtn comme variable locale, de sorte qu'il n'existe que jusqu'à la fin de votre gestionnaire de clic. vous avez besoin d'une variable globale si vous voulez le définir sur 1 le premier clic et être en mesure de vérifier 1 sur le second clic.

Answer 5

Le premier numéro est que la showBtn variables est local à la fonction, il se redéfinie chaque fois que vous exécutez le script ..
Deuxièmement, vous définissez sa valeur juste avant le vérifier .. de sorte qu'il toujours être null ..

puisque vous le liez avec la méthode live qui implique des éléments dynamiques, j'utiliserais la méthode .data().

$('.view-alternatives-btn').live('click', function() { 

var showBtn = $(this).data('showBtn'); 
//$("#nc-alternate-wines").scrollTo(); 
    //$('.nc-remove').toggle(); 
    if (showBtn) { 
    $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif"); 
    $('#nc-alternate-wines').show(); 
    $(this).data('showBtn',true); 
    console.log(showBtn); 
    } 
    else{ 
    $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif"); 
    $('#nc-alternate-wines').hide(); 
    console.log("this " + showBtn); 
    } 
    return false; 
    }); 

Answer 6

Génial, merci pour l'aide à tous!

Je l'ai travail!

var showBtn = 1; 

    $('.view-alternatives-btn').live('click', function() { 

    //$("#nc-alternate-wines").scrollTo(); 
    //$('.nc-remove').toggle(); 

    if (showBtn == 1) { 
     $('.view-alternatives-btn img').attr("src","../images/wsj_hide_alternatives_btn.gif"); 
     $('#nc-alternate-wines').show(); 
     showBtn = 0; 
     console.log(showBtn); 
    } 
    else { 
     $('.view-alternatives-btn img').attr("src","../images/wsj_view_alternatives_btn.gif"); 
     $('#nc-alternate-wines').hide(); 
     console.log("this " + showBtn); 
     showBtn = 1; 
    } 
    return false; 
    });