jquery只能输入数字

 时间:2026-05-03 10:29:06

1、新建html文件。如图:

jquery只能输入数字

2、在html文件上创建一个input输入框,然后设置输入框的大小。

代码:<input type="text" style="width: 190px;">

jquery只能输入数字

3、引入jquery.min.js文件。

代码:<script type="text/javascript" src="jquery-1.9.1.min.js"></script>

如图:

jquery只能输入数字

4、用正则表达式判断用户每次输入的内容,当内容不是数字就不显示。

代码:

<script>

$(function(){

$('input').on('input propertychange', function(e) {

var text = $(this).val().replace(/[^\d]/g, "");

$(this).val(text)  

})

})

</script>

如图:

jquery只能输入数字

5、保存后html文件后,适用浏览器打开进行测试,发现输入非数字的内容无法在文本框上显示。如图:

jquery只能输入数字

6、只需要把所有代码复制到新建的html文件上粘贴,保存后即可看到效果。

所有代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

<script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>

<script>

$(function(){

$('input').on('input propertychange', function(e) {

var text = $(this).val().replace(/[^\d]/g, "");

$(this).val(text)  

})

})

</script>

</head>

<body>

<input type="text" style="width: 190px;">

</body>

</html>

  • 填报教程之FineReport工具: 保存模板至数据库
  • Access如何创建设计用户界面宏
  • C#如何下载图片
  • 如何用代码控制滚动条的位置
  • 天谕青麟镇妖怎么玩
  • 热门搜索
    喝咖啡减肥吗 红烧鲤鱼的家常做法 硬件加速怎么开 痱子怎么办 我的世界服务器怎么进 dnf怎么开盒子 减肥操视频 通报批评怎么写 刺客信条大革命攻略 天津美食攻略