Optimisation du code: jQuery, Javascript

Question

OK, alors voici mon problème, les gens. Je travaille sur un site sur lequel les gens peuvent s'inscrire (x). J'ai un menu déroulant des états pour que les gens choisissent. Basé sur leur sélection d'un état, j'ai une autre liste d'hôpitaux parmi lesquels choisir qui dépend de leur sélection de l'état. Donc, si vous choisissez Hawaii, vous ne verrez que des hôpitaux à Hawaii et pas au Texas, par exemple. J'ai une fonction qui bascule la visibilité en fonction de la valeur d'une case à cocher, mais je n'arrive pas à la faire fonctionner pour la valeur d'une liste déroulante. Des pensées? Merci d'avance. S'il y a une manière plus rapide ou plus standard de résoudre le problème, toute direction dans la bonne direction sera grandement appréciée.

Ce que je suis en train d'utiliser:

$(document).ready(function() 
{ $('#stateinjured').change(function() 
    { 
     $('#stateinjuredky').toggle(this.checked); 
    }); 

}); 

<select> 
<option selected="selected">Select your state</option> 
    <option id="stateinjured" >Kentucky</option> 
    <option>West Virginia</option> 
    <option>Ohio</option> 
    <option>Tennessee</option> 
    </select><br/> 
<select> 
<option style="display:none;" id="stateinjuredky" selected="selected">Choose hospital you visited</option> 
    <option>hospital1</option> 
    <option>hospital2</option> 
    <option>hospital3</option> 
    </select> 

Answer 1

Vous devriez regarder dans AJAX jQuery, il est rapide et vous n'avez pas besoin d'un serveur local à l'utiliser, vous pouvez utiliser votre serveur Web.

regard ici: http://api.jquery.com/category/ajax/

Answer 2

Je pense que vous avez les id et le style sur les mauvais éléments. Vous auriez également besoin d'une logique pour déterminer ce qui a été sélectionné, puis afficher la liste appropriée. Le code ci-dessous n'affichera 1 boîte de sélection de la charge de la page, puis en fonction de ce qui est sélectionné affichera la liste demandée:

$(document).ready(function() 
{ 
    $('#stateinjured').change(function() { 
     var selectedOption = $(this + "option:selected").val(); 
     if (selectedOption == "Kentucky") { 
      $("#stateinjuredky").css("display","block"); 
     } 
     //or you could just have the select ids be the state names, then you wouldn't need all these if...else statements 
    }); 
}); 

Alors ...

<select id="stateinjured"> 
    <option selected="selected">Select your state</option> 
    <option>Kentucky</option> 
    <option>West Virginia</option> 
    <option>Ohio</option> 
    <option>Tennessee</option> 
</select> 
<br/> 
<select id="stateinjuredky" style="display: none;"> 
    <option selected="selected">Choose hospital you visited</option> 
    <option>hospital1</option> 
    <option>hospital2</option> 
    <option>hospital3</option> 
</select> 
<!-- more selects for other states --> 

Il existe des moyens plus efficaces certainement de faire cela cependant, comme d'autres l'ont dit.