jQuery .hide() funktioniert nur die halbe Zeit

Question

Das könnte für einige Leute sehr offensichtlich aussehen, aber ich konnte wirklich nicht herausfinden, warum so etwas passieren könnte, also suche ich nach Hilfe!

Ich habe erweiterte Zeilen, und jede Zeile sollte erweitert werden, um ihre Details anzuzeigen, wenn Sie darauf klicken oder wenn die nächste Schaltfläche gedrückt wird. Sie zeigen und verstecken sich richtig, wenn sie angeklickt werden, aber ich kann es nicht zum Laufen bringen, wenn die nächste Taste gedrückt wird. Teil

Dies ist Js:

var main = function() { 

var curQuantity1 = 0; 
var curQuantity2 = 0; 
var curQuantity3 = 0; 

$('.article').click(function() { 
    $('.description').hide(); 
    $('.article').removeClass('current'); 
    $(this).children('.description').show(); 
    $(this).addClass('current'); 
}); 

$(".next1").click(function() { 
    if (curQuantity1 + curQuantity2 + curQuantity3 == 3){ 
     console.log("Next clicked"); 

     var currentArticle = $('.current'); 
     var nextArticle = currentArticle.next(); 

     currentArticle.removeClass('current'); 
     nextArticle.addClass('current'); 

     $('.description').hide(); 
     $('.current').children('.description').show(); 
    } else { 
     alert("총 3통을 골라주세요"); 
    } 
}); 
...//code here takes care of updating curQuantity so they can add upto 3 
}; 

$(document).ready(main); 

Ich denke hier einfügen HTML-Code könnte es zu lange, aber wird es tun, wenn nötig.

Ich vermute vage, dass Kind möglicherweise nicht seine Elternklasse ändern darf, aber ich konnte keinen Weg finden.

Vielen Dank im Voraus für jede Hilfe! Ich war den ganzen Tag stapfte bekommen :(

Answer 1

Seit .next1 innerhalb .article ist, wenn Sie auf die Schaltfläche Weiter klicken, wird der Klick auch auf den Artikel gesendet wird, die es enthält, wegen Ereignis sprudeln. Also zuerst die .next1 . klicken Handler wird das nächste Element enthüllt, dann ist die .article klicken um die alten Artikel offenbart die Lösung ist event.stopPropagation() zu verwenden, von sprudelnden aus das Ereignis zu stoppen.

$(".next1").click(function(e) { 
    e.stopPropagation(); 
    if (curQuantity1 + curQuantity2 + curQuantity3 == 3){ 
     console.log("Next clicked"); 

     var currentArticle = $('.current'); 
     var nextArticle = currentArticle.next(); 

     currentArticle.removeClass('current'); 
     nextArticle.addClass('current'); 

     $('.description').hide(); 
     $('.current').children('.description').show(); 
    } else { 
     alert("총 3통을 골라주세요"); 
    } 
});