0
votes

Afficher un champ de texte avec une boîte de déroulement choisie

J'essaie d'obtenir le formulaire pour afficher le champ de texte après que l'option Dropdown est choisie.

Alors, lorsque l'option autre forte> est choisie, le champ de saisie sera affiché fort> et devenir requis fort>. p>

<p> What is your profession? </p>
<select id="inputJob" name="inputJob" onchange = 'chooseOther()'>
  <option value="Student">Student</option>
  <option value="Teacher">Teacher</option>
  <option value="Other">Other</option>
</select>
<input id = "inputOtherJob" name = "inputOtherJob" style = 'display: none'>

javascript html web

1 commentaires

Vous avez oublié d'obtenir la valeur: var option = document.getelementByID ("INPUTJOB"). Valeur;



                                    
                    3 Réponses :
                    
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                      option.selectedOptions [0] .text  pour afficher le texte sélectionné. 
 Utiliser l'attribut requis pour le rendre requis.   xxx                                  

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     utiliser  si (option.value == 'autre')  code>, vous devez comparer  option.value  code> pas  Option  code> car l'option est la  Instanceof HTMLEMENT  CODE> Vous devez donc obtenir sa valeur   code>. 
  p> 


<p> What is your profession? </p>
<select id="inputJob" name="inputJob" onchange = 'chooseOther()'>
  <option value="Student">Student</option>
  <option value="Teacher">Teacher</option>
  <option value="Other">Other</option>
</select>
<input id = "inputOtherJob" name = "inputOtherJob" style = 'display: none'>

                                

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Voici une solution rapide. Principalement, vous souhaitez tester contre l'option.value == 'Autre' plutôt que l'option == 'Autre'   P> 

<select id="inputJob" name="inputJob" onchange='chooseOther()'>
    <option value="Student">Student</option>
    <option value="Teacher">Teacher</option>
    <option value="Other">Other</option>
</select>
<input id="inputOtherJob" name="inputOtherJob" style='display: none'>
<script>
    function chooseOther() {
        var option = document.getElementById("inputJob");
        if (option.value == 'Other') {
            var field = document.getElementById("inputOtherJob");
            field.setAttribute("style","display:inline");
        }
    }
</script>

                                

                                                                    
                                    
                                    
                                        0 commentaires