Je dois modifier cette méthode de masquage CSS de sorte que lorsque l'utilisateur Type dans ce champ d'entrée, ils ne peuvent entrer que des valeurs compris entre -9999999 à 9999999.
Le champ de saisie ne peut pas être tapé = numéro, il doit être le type. = texte. Ce serait le moyen le plus simple d'y aller, cependant, il s'agit d'une exigence d'entreprise que tous les champs de saisie doivent ressembler à la même chose. P>
Voici la méthode de masquage actuelle qui doit être modifiée: p >
maskInputAmount(e) {
const t = e.target.value.replace(/\[a-z]/g, '').match(/(-?)(\d{0,8})/);
e.target.value = t[2] ? (t[1] + t[2]) : t[2];
}
3 Réponses :
Premièrement, si vous ne pouvez pas utiliser les entrées de numéro en raison du style, utilisez
let myInput = document.getElementById("my-input");
let myInputValue = myInput.value;
let regex = new RegExp(/(^\-?[0-9]{0,11}$)/);
myInput.addEventListener("input", (e)=>{
e.preventDefault();
if (regex.test(myInput.value))
{
console.log("Change value " + myInputValue + " to " + myInput.value);
myInputValue = myInput.value;
}
else
{
myInput.value = myInputValue;
}
});
Je peux essayer cela, où ferais-je ces changements? Sur le champ d'entrée lui-même sur le HTML? Exemple:
J'ai mis à jour la réponse avec un exemple @ ghostagent151
Si cela fonctionne pour vous, c'est plus simple que mon approche: D
Sa fermeture mais ne fonctionne pas correctement. Le signe ne peut venir que dans la première position du champ de saisie. Dans la Jsfiddle, vous avez, je suis capable de placer le signe n'importe où dans le champ de saisie.
Si vous souhaitez ajouter des restrictions, vous devrez vérifier les entrées de clé de JS avant de les ajouter à la valeur de votre entrée, vous ne pouvez pas le faire dans CSS / HTML uniquement @ Ghostagent151
J'ai mis à jour ma réponse avec quelque chose qui ressemble plus à vous voulez @ ghostagent151
Cela ressemble à une bonne solution, mon application est en angulaire, donc son utilisation dossuée. Je vais essayer de modifier votre code JSfiddle afin qu'il soit compatible avec ma demande et vous permettra de connaître le résultat.
Vous pouvez correspondre aux chiffres compris entre -9999999 à 9999999 avec la regex suivante: Même motif pour une entrée: p> p>
<input type="text" pattern="^-?[0-9]\d{0,6}$">
La regex va bien, le défi consiste à masquer le champ de saisie, de sorte que l'utilisateur ne puisse entrer qu'un signe négatif dans la première position et n'entrerai que des entiers après cela. Ou seulement entrer des entiers
Vous pouvez utiliser le même modèle pour un champ d'entrée également (mis à jour la réponse).
Pour ce modèle, si je le mettit dans le champ de saisie, il ne permettra que des entiers positifs et des entiers négatifs, seul un négatif suivi de seulement 0, par exemple: -0000
Merci à tous pour l'aide. Bien qu'il n'y ait pas eu une réponse spécifique à résoudre mon problème exact, certaines de vos réponses m'ont conduit au bon chemin.
Voici ce que j'ai fait pour modifier ma méthode d'origine
dans mon fichier TS: dans mon HTML:
Si l'exigence de l'entreprise est "Tous les champs de saisie doivent avoir la même chose" qui fait pas dire que vous doit utiliser entrée
type = "texte" . Si l'exigence d'activité indiquée est en fait que vous devez utilisertype = texte , bien, qui n'a aucune entreprise étant une exigence d'entreprise. J'aime l'approche de call_in: utilisez la bonne chose et changez son apparence - qui a peut-être été dérivé d'un réponse plus ancienne qui comprend également Firefox (non webkit)La réponse de call_in est la chose la plus proche de la réponse que j'ai trouvée. Le seul problème est qu'ils ne veulent pas que l'utilisateur puisse entrer des caractères autres que les entiers et a - signe dans la première position. Oui, il y a un motif que je peux ajouter pour la validation, mais ce n'est pas la manière dont l'entreprise souhaite la candidature développée.