### 正则表达式在JavaScript中的应用：限制文本框输入
#### 一、概述
本文档将详细介绍如何利用JavaScript中的正则表达式来限制HTML表单中的文本框只能输入特定类型的字符，例如数字、小数点和英文字母等。通过不同的正则表达式和事件处理函数的组合，我们可以实现各种复杂的输入限制功能。
#### 二、基础知识
1. **正则表达式**：是一种强大的文本处理工具，能够帮助我们匹配、查找、替换等操作。
2. **JavaScript**：一种广泛使用的脚本语言，常用于Web开发中增加交互性和动态效果。
3. **HTML**：超文本标记语言，用于定义网页结构。
4. **事件监听器**：JavaScript中的机制，用于响应用户的动作，如点击、按键等。
5. **常用事件**：
- `onkeyup`：当用户释放键盘上的一个键时触发。
- `onkeydown`：当用户按下键盘上的一个键时触发。
- `onkeypress`：当用户按下并释放键盘上的一个键时触发。
- `onbeforepaste`：在粘贴数据到输入框之前触发。
- `onafterpaste`：在粘贴数据到输入框之后触发。
#### 三、具体实现
**1. 限制文本框只能输入数字（不包括小数点）**
```html
<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">
```
这里的正则表达式`\D`匹配所有非数字的字符，`g`表示全局搜索，即替换所有的匹配项。
**2. 限制文本框只能输入数字且可以包含小数点**
```html
<input onkeyup="if(isNaN(value))execCommand('undo')" onafterpaste="if(isNaN(value))execCommand('undo')">
<input name=txt1 onchange="if(/\D/.test(this.value)){alert('只能输入数字');this.value=''}">
```
这里使用了`isNaN(value)`函数判断值是否为数字，如果不是数字，则执行撤销命令`execCommand('undo')`取消最后一次操作。
**3. 限制文本框输入数字和小数点（方法二）**
```html
<input type=text t_value="" o_value="" onkeypress="..." onkeyup="..." onblur="...">
```
这段代码较为复杂，通过多个事件监听器实现更细致的控制，如记录原始值和临时值等，确保输入符合要求。
**4. 限制文本框只能输入字母和汉字**
```html
<input onkeyup="value=value.replace(/[\d]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[\d]/g,''))" maxlength=10 name="Numbers">
```
这里使用了`[\d]`匹配所有数字，并通过`onbeforepaste`事件在粘贴前过滤掉数字。
**5. 限制文本框只能输入英文字母和数字，不能输入中文**
```html
<input onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">
```
`[^\w\.\/]`表示除了单词字符、点号和斜线之外的所有字符。
**6. 限制文本框只能输入数字和英文（示例代码中的“chun”应为占位符）**
```html
<input onKeyUp="value=value.replace(/[^\d|chun]/g,'')">
```
这里使用了`[^\d|chun]`来排除数字和指定字符串“chun”。
**7. 限制文本框小数点后只能有最多两位**
```html
<input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /\.\d\d$/.test(value))event.returnValue=false">
```
此段代码通过`keyCode`判断输入键值是否为数字或小数点，并检查小数点后的数字个数。
**8. 限制文本框小数点后只能有最多两位，允许输入运算符号**
```html
<input onkeyup="this.value=this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')">
```
使用`^(\-)*(\d+)\.(\d\d).*`正则表达式匹配开头的负号、整数部分、小数点后两位及后面的任意字符，并保留前三位。
**9. 限制文本框只能输入汉字**
```html
<input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))">
```
这里使用了`\u4E00-\u9FA5`来匹配所有汉字范围内的字符。
以上就是通过JavaScript中的正则表达式来限制HTML表单中输入框输入的具体实现方法。这些示例可以帮助开发者根据需求灵活选择和组合，以达到所需的输入限制效果。
VIP享7折，此内容立减4.47元 
