Javascript Girl
  1. Javascript Girl
  3. Les choix conditionnels devraient être soit
Intereting Posts
Tri d'un ensemble de sélecteurs CSS sur la base de la spécificité Validation côté client Javascript ou Server Side validation PHP Ajout de millisecondes à la minuterie en html Pourquoi les antécédents ne peuvent-ils pas décrire () les blocs voient-ils définis dans les blocs externes? Un moyen simple d'effacer la valeur de toute entrée dans une div? Croiser navigateur preventDefault () sans jQuery Contient avec JS "utilisé avant défini" et Titanium Developer Émission d'une requête HTTP GET synchrone ou d'un script Shell appelant JavaScript depuis iOS UIAutomation Comment capturer iframe redimensionner l'événement à partir de l'iframe (iframe et la page – même domaine) Instance v variables d'état dans react.js En quoi consiste exactement la "fermeture" en JavaScript? Jquery a soudainement cessé d'analyser xml Comment structurer les structures if-Else dans les vues liées aux données? Fonction JavaScript si url a une étiquette hash et l'utilisateur vient de naviguer vers l'avant ou vers l'arrière avec le navigateur? Mesurer et comparer le pouvoir de traitement d'un moteur javascript dans un navigateur

Les choix conditionnels devraient être soit

Voici un exemple de l'existence du code actuel: http://jsfiddle.net/rym2g/

La seule chose dont j'ai besoin pour faire maintenant est basée sur le choix qui a été fait, assurez-vous que c'est le seul choix disponible … par exemple:

qui es-tu?

  • Jim
  • Kyle
  • Becky

(Vous avez choisi becky)

Afficher la forme de Becky

(Vous avez décidé que vous vouliez choisir Kyle au lieu de becky)

Cacher la forme de Becky et afficher la forme de Kyle uniquement

J'espère que je me suis très bien expliqué. 

<form> <ul class="form-nav"> <li><a href="#a-1">AAA</a></li> <li><a href="#a-2">BBB</a></li> </ul> </form> <form class="hidden" id="a-1"> <ul class="form-nav"> <li><a href="#a-1-1">aaa</a></li> <li><a href="#a-1-2">bbb</a></li> </ul> </form> <form class="hidden" id="a-1-1"> <p>A-1-1</p> </form> <form class="hidden" id="a-1-2"> <p>A-1-2</p> </form> <form class="hidden" id="a-2"> <ul class="form-nav"> <li><a href="#a-2-1">111</a></li> <li><a href="#a-2-2">222</a></li> </ul> </form> <form class="hidden" id="a-2-1"> <p>A-2-1</p> </form> <form class="hidden" id="a-2-2"> <p>A-2-2</p> </form>

Et JavaScript: 

 $(document).on("click", "ul.form-nav a", function(event) { event.preventDefault(); var id = event.target.href.replace(/^[^#]+/, ""); console.log("Going to: " + id); $(id).show().focus(); });

Il y a plusieurs façons, mais c'est le plus simple étant donné ce que vous faites: 

 $(document).on("click", "ul.form-nav a", function(event) { event.preventDefault(); var id = event.target.href.replace(/^[^#]+/, ""); console.log("Going to: " + id); // Hide forms that do not have the selected id $('form.hidden').not(id).hide(); // Show the appropriate form $(id).show().focus(); });

Voir le violon

D'accord,

Je suis arrivé à ce code suivant. Tout ce que je dois faire maintenant est de s'assurer que toutes les questions restent visibles compte tenu du chemin sur lequel l'utilisateur est activé. De cette façon, l'utilisateur peut aller vers l'arrière ou vers l'avant s'il choisit un chemin différent.

J'espère que je me suis bien compris. Voici le violon http://jsfiddle.net/XuVUb/ 

 <script type="text/javascript"> function show_table(id){ document.getElementById('table1').style.display='none'; document.getElementById('table11').style.display='none'; document.getElementById('table12').style.display='none'; document.getElementById('table13').style.display='none'; document.getElementById('table14').style.display='none'; document.getElementById('table15').style.display='none'; document.getElementById('table16').style.display='none'; document.getElementById('table2').style.display='none'; document.getElementById('table21').style.display='none'; document.getElementById('table22').style.display='none'; document.getElementById('table23').style.display='none'; document.getElementById('table24').style.display='none'; document.getElementById('table25').style.display='none'; document.getElementById('table26').style.display='none'; document.getElementById('table3').style.display='none'; document.getElementById('table'+id).style.display='block'; } </script>