input,验证,闪动,自动删除,限制输入

根据给定文件的信息，我们可以总结出以下几个主要的知识点： ### 1. JavaScript 验证功能：限制用户输入 #### 1.1 只允许输入英文字符 ```html <input type="text" onkeyup="value=value.replace(/[^a-zA-Z]/g,'')"> ``` 这一行代码的作用是限制输入框中的文本只能包含英文字符（大写或小写）。当用户在输入框中键入字符后，`onkeyup`事件会触发，并通过正则表达式`[^a-zA-Z]`匹配所有非英文字母的字符并将其替换为空字符串，从而达到只允许输入英文字符的效果。 #### 1.2 增强版英文字符输入限制 ```html <input type="text" onkeyup="value=value.replace(/[^\a-\z\A-\Z]/g,'')" onkeydown="fncKeyStop(event)" onpaste="return false" oncontextmenu="return false"> ``` 除了基本的字母限制之外，这里还添加了`onkeydown`、`onpaste`和`oncontextmenu`事件处理程序： - `onkeydown`通过`fncKeyStop(event)`函数阻止特定按键的操作； - `onpaste`阻止用户粘贴内容； - `oncontextmenu`阻止右键菜单出现。 #### 1.3 只允许数字输入 ```html <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')"> ``` 这个示例通过`onkeyup`和`onafterpaste`事件来实现，仅允许用户输入数字。其中`\D`表示非数字字符，通过替换为空字符串来清除这些字符。 #### 1.4 数字与小数点的输入限制 ```html <input name="price" type="text" onkeyup="value=value.replace(/[^\d\.]/g,'')"> <input name="price" type="text" onkeyup="value=value.replace(/[^\d\._]/g,'')"> ``` 这里提供了两种限制方式： - 第一种只允许输入数字和一个点号； - 第二种也只允许输入数字，但允许使用下划线作为分隔符。 #### 1.5 只允许输入英文和数字 ```html <input onkeyup="value=value.replace(/[\W]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"> ``` 此代码片段允许用户输入英文字符和数字。通过`[\W]`匹配所有非单词字符并清除它们。同时，通过`onbeforepaste`事件限制粘贴内容只能包含数字。 #### 1.6 只允许输入中文字符 ```html <input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))"> ``` 这里利用正则表达式`[^\u4E00-\u9FA5]`来匹配所有非中文字符，并通过替换操作将这些字符清除，实现只允许输入中文字符的功能。 ### 2. 输入框IME模式设置及限制 ```html <input type="text" style="ime-mode:disabled"> ``` 这一行代码设置了输入框的IME模式为`disabled`，即禁用输入法编辑器。这样可以防止用户使用IME输入方法进行输入，适用于需要直接输入英文或数字等简单字符的情况。 ### 3. 输入框验证提示 ```html <input onblur="if(this.value.replace(/^+|+$/g,'')=='')alert('不能为空!')"> ``` 这段代码通过`onblur`事件检查输入框失去焦点时的值是否为空。如果为空，则弹出警告提示框“不能为空!”。 ### 4. 按下Enter键时的处理 ```html <input onkeydown="if(event.keyCode==13)event.keyCode=9"> ``` 该代码段用于捕获用户按下Enter键(键盘码为13)时的事件，并将事件的键盘码更改为Tab键的键盘码(9)，这样用户按下Enter键时就会像按下Tab键一样切换到下一个输入框。 ### 5. 输入框读取只读 ```html <input readonly value="只读显示"> ``` 通过设置`readonly`属性，可以使输入框变为只读状态，用户无法修改其内容，通常用于显示预定义的数据。 ### 6. 自定义验证函数 ```javascript <script language="javascript"> function onlyNum() { if (!((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || (event.keyCode == 8))) { event.returnValue = false; } } </script> ``` 这段JavaScript代码定义了一个名为`onlyNum`的自定义验证函数，用来限制输入框只能输入数字。函数通过检测键盘事件(`event`)的`keyCode`属性来判断用户输入的是不是数字键（包括标准键盘上的数字键和小键盘上的数字键），以及Backspace键（退格键）。如果不是这些键，则返回`false`，阻止其被输入。 以上内容总结了给定文件中的关键知识点，包括不同类型的输入限制、IME模式的设置、输入验证提示以及自定义验证函数的编写。这些技巧可以帮助开发者更好地控制用户的输入行为，提高应用的安全性和用户体验。