Prévenir des entrées dans le formulaire input type=“number”?

Je veux restreindre l'entrée d'utilisateur pour les nombres positifs, dans un formulaire html.

Je sais que vous pouvez définir min="0", il est cependant possible de contourner cette en entrant manuellement un nombre négatif.

Est-il un autre moyen de résoudre ce sans écrire une fonction de validation?

En HTML 5 u peut faire comme ceci: <input type="number" name="quantite" min="0">, et je pense que c'est la façon la plus élégante pour limiter l'entrée d'utilisateur pour les nombres positifs, sans écrire une fonction de validation.
Ce qui a été mentionné dans la question, ainsi que ses limites.
Sachez que les utilisateurs peuvent toujours contourner ces limitations! Si vous soumettez rien à côté serveur (lire db ou d'extraction de données fonctions de), vous devez valider une fois de plus de toute façon.

InformationsquelleAutor Ali | 2015-07-22

69

Ce utilise du Javascript, mais vous n'avez pas à écrire votre propre routine de validation. Au lieu de cela il suffit de cocher la validity.valid de la propriété. Ce sera vrai si et seulement si l'entrée se situe dans la plage.

HTML:
```
<html>
<body>
<form action="#">
  <input type="number" name="test" min=0 oninput="validity.valid||(value='');"><br>
  <input type="submit" value="Submit">
</form>
</body>
</html>
```
- Vraiment génial! il permet seulement les nombres qui sont entre Min un Max, au Lieu d'écrire du code javascript comme d'autres l'ont suggéré, de son mieux pour aller avec ce oninput="validité.valide||(valeur=");"
- Le seul problème avec cette solution est qu'il efface la valeur précédente saisie lorsqu'une valeur non valide est entré.
- Comment pouvons-nous éviter l'entrée de la délinquance de la clé et pas de dégagement de la totalité du champ?
- Vous pouvez peut utiliser quelque chose comme <input type="number" name="test" min=0 save="" oninput="validity.valid ? this.save = value : value = this.save;"> Évidemment, cela ne devrait pas être utilisé comme... Vous devez écrire votre propre fonction de gestionnaire qui vérifie la validité.valide et fait la bonne chose.
InformationsquelleAutor Mikel Rychliski
30

Ce n'est pas possible sans la validation de la valeur de l'entrée.

type d'entrée=nombre

L'élément input avec l'attribut type dont la valeur est "nombre" représente un contrôle précis pour le réglage de la valeur de l'élément à un chaîne représentant un nombre.

Puisque c'est une chaîne de caractères représentant le nombre il n'y a aucun moyen d'être sûr que la chaîne peut être représentant des valeurs numériques ou non.

Le Permis attributs ne vous donnera pas la possibilité de valider la valeur de la saisie du numéro de contrôle.

Une façon de le faire avec l'aide de JavaScript pourrait ressembler à ceci.

JS:
```
//Select your input element.
var numInput = document.querySelector('input');

//Listen for input event on numInput.
numInput.addEventListener('input', function(){
    //Let's match only digits.
    var num = this.value.match(/^\d+$/);
    if (num === null) {
        //If we have no match, value will be empty.
        this.value = "";
    }
}, false)
```
HTML:
```
<input type="number" min="0" />
```
Si vous êtes de rabotage sur l'envoi de vos données sur un serveur assurez-vous de valider les données sur le serveur en tant que bien.
Côté Client JavaScript ne peut pas garantir que les données en cours d'envoi sera ce que vous en attendez.

InformationsquelleAutor DavidDomain
3

Si vous voulez vous assurer que la valeur par défaut, j'.e valeur min, ou toute autre valeur, c'est la solution de travail. C'est aussi la prévention pour effacer le champ de saisie. Même façon, vous pouvez définir à la valeur max ainsi.

HTML:
```
<input type="number" min="1" max="9999" maxlength="4" oninput="this.value=this.value.slice(0,this.maxLength||1/1);this.value=(this.value   < 1) ? (1/1) : this.value;">
```
- > "C'est aussi la prévention pour effacer le champ de saisie" Pas de. Cela efface l'entrée et remplit que le minimum. Pas efface - lorsque vous tapez 123 et 123 voir sur le terrain.
InformationsquelleAutor user7135197
1

Le script suivant permet uniquement de chiffres ou de retour arrière pour être entré dans l'entrée.

JS:
```
var number = document.getElementById('number');

number.onkeydown = function(e) {
    if(!((e.keyCode > 95 && e.keyCode < 106)
      || (e.keyCode > 47 && e.keyCode < 58) 
      || e.keyCode == 8)) {
        return false;
    }
}
```
HTML:
```
<input type="number" id="number" min="0">
```
- C'est trop restrictive car elle ne permet pas à l'utilisateur d'onglet en dehors du champ extrêmement important pour la rapide entrée de données, les applications ou les technologies d'assistance (par exemple, les gens qui ne peuvent pas utiliser une souris onglet dans le domaine et ils sont coincés)
InformationsquelleAutor Tiny Giant
1

type="number" déjà résout permettant uniquement des chiffres à taper comme d'autres réponses ici, point de sortir.

Juste pour la référence: avec jQuery, vous pouvez remplacer les valeurs négatives sur focusout avec le code suivant:
```
$(document).ready(function(){
    $("body").delegate('#myInputNumber', 'focusout', function(){
        if($(this).val() < 0){
            $(this).val('0');
        }
    });
});
```
Cela ne remplace pas de côté de serveur de validation!!!

InformationsquelleAutor Hafenkranich

Vous devez vous connecter pour publier un commentaire.

type d'entrée=nombre