11528 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous Smiley biggrin ,
Je fais un formulaire assez simple avec des blocs dans des fieldsets (9 au total).
J'ai 'display none' tous les fieldset et ne laissant que le premier nth-1rst of type en display block.

Je voudrais display block le bloc fieldset suivant au clikc sur mon bouton avec id='next", et cacher le précédent.

J'ai ecrit ce code mais ne fonctionne pas, tout les bloc s'affichent au click?

Avez vous une idée de mon erreur?

Merci à tous !


$number1 = $("fieldset").length;
    for (var i = 1; i < $number1; i++) {
        $("#next").click(function () {

                console.log(i);
                $('fieldset').closest('fieldset').next().show();
                $('fieldset').closest('fieldset').prev().hide();

                console.log('click')
            }
        )
    }
J'ai écrit ce code, ca ne cache pas la bonne, mais affiche la dernière au lieu de la suivant. (ca passe du bloc 1 au 9, au lieu du 1 au 2)

    $("#next").click(function () {

        $('fieldset').next().show();
        $('fieldset').prev().hide();

        console.log('click')
    });

Modifié par louyi (22 Jun 2021 - 09:28)
Salut,

en regardant rapidement : ta boucle m'a l'air de ne servir à rien (Tu dois pouvoir le voir en regardant le console.log(i) ).

A priori tu as seulement besoin de savoir sur quel fieldset tu es. J'ai mis une variable $current pour ça.
Ensuite il faut juste qu'au click sur next tu caches cet élément et que tu affiches le suivant.

$current=0;
$("#next").click(function () {
  $('fieldset').eq($current).hide();
  $current+=1;
  $('fieldset').eq($current).show();
});



Vu qu'il n'y a pas ton code html/css j'en ai bidouillé un vite fait pour faire un exemple (en essayant de comprendre tes instructions) :
https://jsfiddle.net/Lj4s67ph/

Bonne journée
Modifié par Mathieuu (22 Jun 2021 - 12:12)