Fonction Javascript pour renseigner un champ en fonction de l'entrée de l'utilisateur dans un autre champ

Ceci implique javascript dans un formulaire HTML. Le problème que j'ai est de remplir un champ dans le même formulaire basé sur l'entrée d'un autre champ. Lorsque l'utilisateur saisit une lettre (A, B ou C), j'essaie de mettre à jour le champ de pourcentage à 100 ou 75 en fonction de la qualité de la lettre (A & B = 100, C = 75). Ci-dessous est ce que j'ai essayé jusqu'à présent, il ne semble pas fonctionner correctement.Fonction Javascript pour renseigner un champ en fonction de l'entrée de l'utilisateur dans un autre champ

function PercentResult(grade) 
{ 
    if (grade.equalsIgnoreCase("A")) 
    { 
    return 100; 
    } 
    if (grade.equalsIgnoreCase("B")) 
    return 100; 
    if (grade.equalsIgnoreCase("C")) 
    return 75; 
    return 0; 
}

Source

2010-11-08 John Buoy

Il n'y a pas de "equalsIgnoreCase" dans Javascript; vous pouvez être dérouté par quelque chose de la langue entièrement différente de Java.

Je venais d'utiliser une recherche:

function percentResult(grade) { 
    var grds = { 'A': 100, 'B': 100, 'C': 75 }; 
    return grds[grade.toUpperCase()]; 
}

(. Il y a plusieurs façons de définir la recherche qui serait un peu plus efficace, mais qui est juste une illustration)

modifier — googling autour J'ai trouvé quelques exemples d'implémentations de faire "equalsIgnoreCase" pour Javascript, mais ce sont surtout des wrappers simples autour d'une comparaison de valeurs supérieures ou inférieures. Dans ce cas, il n'y a aucun besoin réel de toute façon.

Source

2010-11-08 17:01:49 Pointy

La façon la plus simple de le faire est avec un ensemble limité - zone de liste déroulante à la boîte d'entrée

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Grades</title> 
</head> 
<body> 
    <form> 
     <table> 
      <tr> 
       <td>Combo Box</td> 
       <td> 
        <select id="combo1" name="combo1" onchange="input1.value = combo1.value"> 
         <option value="100">A</option> 
         <option value="75">B</option> 
         <option value="50">C</option> 
         <option value="25">D</option> 
         <option value="0"">E</option> 
        </select> 
       </td> 
      </tr> 
      <tr> 
       <td>Input Box</td> 
       <td> 
        <input type="text" name="input1" id="input1"/> 
       </td> 
      </tr> 
     </table> 
    </form> 
</body> 
</html>

au-delà, ou si vous avez vraiment besoin de gestionnaires d'événements, vous devez les coder en tant que tel. Voici un petit exemple qui fait ce que vous voulez:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Grades</title> 
<script type="text/javascript"> 
    function eventHandler() { 
     var target = document.getElementById('input1'); 
     var value = document.getElementById('input2').value; 
     value = value.trim().toUpperCase(); 
     if(value == "A") { 
      target.value = "100%";   
     } 
     else if(value == "A") { 
      target.value = "100%";   
     } 
     else if(value == "B") { 
      target.value = "75%";   
     } 
     else if(value == "C") { 
      target.value = "50%";   
     } 
     else if(value == "D") { 
      target.value = "25%";   
     } 
     else if(value == "E") { 
      target.value = "0%";    
     } 
    } 
</script> 
</head> 
<body> 
<form> 
<table> 
    <tr> 
     <td>Combo Box</td> 
     <td><input type="text" name="input2" id="input2" 
      onblur="eventHandler()" onchange="eventHandler" value="A" /></td> 
    </tr> 
    <tr> 
     <td>Input Box</td> 
     <td><input type="text" name="input1" id="input1" /></td> 
    </tr> 
</table> 
</form> 
</body> 
</html>

Certains de ce genre de choses peut être navigateur assez rapide, dépendant alors assurez-vous de vérifier le document api js pour le navigateur que vous ciblez.

Source

2010-11-08 17:22:40 lscoughlin

Fonction Javascript pour renseigner un champ en fonction de l'entrée de l'utilisateur dans un autre champ

Répondre

Questions connexes