Comment afficher plusieurs entrées à l'aide de jquery

Question

J'ai un formulaire où l'utilisateur peut choisir d'entrer plusieurs options. Je montre actuellement un champ de saisie et cache les 4 champs de saisie restants pour cette option.

Auparavant, j'ai utilisé un lien sous chaque entrée pour afficher l'entrée et le lien suivants.

$(function(){ 
    $(".show").click(function() { 
     $(this).parent().next("div").show(); 
     evenpreventDefault(); 
    }); 
}); 

Mais je veux utiliser un seul lien pour réafficher les entrées cachées un par un (premier clic = première entrée cachée, second clic = seconde input..so sur.).

Est-ce possible dans jquery, j'apprécie toute aide.

Answer 1

Je pense que vous vouliez montrer 1 par 1, donc la solution est la suivante:

Working demo

HTML

<div id="wrapper"> 
    <div> 
      <a href="#" class="show">Show</a> 
    </div> 
     <div class="test" id="1"><input type="text" value="1"/></div> 
     <div class="test" id="2"><input type="text" value="1"/></div> 
     <div class="test" id="3"><input type="text" value="1"/></div> 
     <div class="test" id="4"><input type="text" value="1"/></div> 
</div> 

JQUERY

$(".test").hide(); 
    $(".show").click(function() {  

     $(this).parent().siblings("div:not(:visible)").first().show(); 
     evenpreventDefault(); 
    }); 

Le lien d'exposition et les liens cachés doivent avoir le même parent, donc pour être au même niveau de structure, vous demandez les frères et sœurs visibles, mais seulement le premier, et ensuite vous le montrez.

Answer 2

.. il ne fonctionnera pas avec des erreurs de syntaxe!

$(".test").hide(); 
    $(".show").click(function (event) {  
     $(this).parent().siblings("div:not(:visible)").first().show(); 
     event.preventDefault(); 
});