Ich versuche ein einfaches Schrittformular mit 4 Schritten zu erstellen. Ich habe i = 1 erstellt, um den aktuellen Schritt zu steuern. Innerhalb der Funktion click habe ich i++ für das nächste Klickereignis erhöht. Der nächste Schritt wird angezeigt:

var i = 1;

  if (i <= 4 ) {
    $('.step' + i).each(function(){
      $(this).find('a').on('click', function(e){
        e.preventDefault();

        i++;

        $('.step' + i).animate({opacity: 1}, 200);
      });
    });
  };

Wie Sie sehen können, verwende ich die Ereignisse .each und click, um das aktuelle <a> anzuklicken, aber es funktioniert nicht. Etwas Hilfe wäre dankbar.

BEARBEITEN-------

Js Geige: https://jsfiddle.net/gtsjhe1y/

1
Ramon Vasconcelos 17 Aug. 2015 im 16:49

4 Antworten

Beste Antwort

Sie müssen nur diese Zeile ändern $('.step').each(function(){...

var i = 1;

if (i <= 4 ) {
$('.step').each(function(){
  $(this).find('a').on('click', function(e){
    e.preventDefault();
    i++;
    $('.step' + i).animate({opacity: 1}, 200);
   });
 });
};

Das Beispiel jsfiddle.

2
Mario Kurzweil 17 Aug. 2015 im 14:07

Ihr Code tut dies: 1- i = 1 2- Wenn i <4 ist, wird diese Bedingung EINMAL ausgeführt, da sie sich nicht in der Schleife oder in der Funktion 3- $ ('. Schritt' + i) befindet, wobei i = 1 ist, sodass dies zurückkehrt nur ein Wert step1 Element 4- .each wird einmal ausgeführt, da es an einem Element arbeitet step1 Hinweis: Das ".on", das Sie ausführen, bindet also nur den Link step1, nicht die Elemente 5- in Ihrem Rückruf für "on click" nur in Schritt 1 "i ++ inkrementiert den i-Wert.

Wenn Sie das nächste Mal in Schritt 1 auf den Link klicken, wird das nächste Element angezeigt.

Die anderen Links, die nicht mit "on click" verknüpft sind, werden aktualisiert, wenn Sie darauf klicken

1
Bassem Reda Zohdy 17 Aug. 2015 im 14:10

Bis zu dem Zeitpunkt, an dem die Taste gedrückt wird, ist der Wert der Variablen "i" gleich 4. Sie können beispielsweise Ihre Bindung an eine anonyme Funktion einschließen und "i" als Argument übergeben, einige davon wie folgt:

$('.step' + i).each(function(){
  (function(i){
     $(this).find('a').on('click', function(e){
       e.preventDefault();

       $('.step' + i).animate({opacity: 1}, 200);
     });
  })(i++);
});
1
Legotin 17 Aug. 2015 im 14:02

https://jsfiddle.net/gtsjhe1y/2/ Es findet es nicht richtig. Versuche dies.

$(this).parent().find('a').on('click', function(e){
3
JaredT 17 Aug. 2015 im 14:01