recherche

Maison >interface Web >js tutoriel >js pour implémenter une zone de texte qui permet uniquement la saisie de nombres et limite la taille des compétences number_javascript

js pour implémenter une zone de texte qui permet uniquement la saisie de nombres et limite la taille des compétences number_javascript

WBOY
WBOYoriginal
2016-05-16 15:44:191492parcourir

L'exemple de cet article décrit la méthode d'utilisation de js pour implémenter une zone de texte qui permet uniquement la saisie de nombres et limite la taille des nombres. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants :

Il s'agit d'un effet de zone de saisie très personnalisé. Il est stipulé que la zone de texte autorise uniquement la saisie de chiffres. Si vous insistez pour saisir d'autres caractères, les caractères saisis disparaîtront automatiquement à moins que vous ne saisissiez le format de caractère spécifié, et là. il y a également des restrictions sur la taille des nombres saisis ! Pour garantir la compatibilité, veuillez utiliser Firefox.

La capture d'écran de l'effet en cours d'exécution est la suivante :

L'adresse de la démo en ligne est la suivante :

http://demo.jb51.net/js/2015/js-input-limit-num-codes/

Le code spécifique est le suivant : 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>首页</title>
<style type="text/css">
html,body{margin:0; padding:20px;}
</style>
</head>
<body>
<input type="text" id="input" />
<script type="text/javascript">
var text = document.getElementById("input");
text.onkeyup = function(){
this.value=this.value.replace(/\D/g,'');
if(text.value>100){
  text.value = 100;
}
}
</script>
</body>
</html>

J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Méthode JS pour implémenter les touches fléchées pour changer le focus des compétences de saisie box_javascriptArticle suivant：Méthode JS pour implémenter les touches fléchées pour changer le focus des compétences de saisie box_javascript

Articles Liés

Voir plus