通常我们需要对用户文本输入进行字符数量上的限制,对于<input type="text" value="" />文本输入域,我们可以通过maxlength属性来限制用户可输入的最大字符数,但是textarea这种文本输入域的话我们只能通过js来控制输入字符数了,因为它没有提供maxlength属性。首先我们定义一个简单的函数,如下:
/**
* 限制textarea文本域输入的字符个数
* @id textarea表单ID
* @count 要限制的最大字符数
*/
function limitChars(id, count){
var obj = document.getElementById(id);
if (obj.value.length > count){
obj.value = obj.value.substr(0, count);
}
}
说明:这个函数的作用就是当textarea文本域中的字符数超过指定个数时即进行截取。有了这个函数,我们接下来要做的就是选择在何时调用该函数:
<textarea id="mytext" cols="" rows="" onkeydown="limitChars(''mytext'', 120)" onchange="limitChars(''mytext'', 120)" onpropertychange="limitChars(''mytext'', 120)"></textarea>
说明:1、onkeydown监控用户键盘输入并进行字符截取;2、onchange防止用户通过复制粘贴功能输入超过指定最大字符数的字符;3、onpropertychange针对IE(FF中无效),作用就是当用户通过复制粘贴功能来进行输入时,当粘贴完成的瞬间即进行字符截取,而不是像onchange那样需要等到焦点离开textarea控件时才进行字符截取(该属性主要为了用户体验上的效果,没有该属性已经可以真正完成限制字符输入个数的任务)。
说明:这个函数的作用就是当textarea文本域中的字符数超过指定个数时即进行截取。有了这个函数,我们接下来要做的就是选择在何时调用该函数:
<textarea id="mytext" cols="" rows="" onkeydown="limitChars('mytext', 120)" onchange="limitChars('mytext', 120)" onpropertychange="limitChars('mytext', 120)"></textarea>
说明:1、onkeydown监控用户键盘输入并进行字符截取;2、onchange防止用户通过复制粘贴功能输入超过指定最大字符数的字符;3、onpropertychange针对IE(FF中无效),作用就是当用户通过复制粘贴功能来进行输入时,当粘贴完成的瞬间即进行字符截取,而不是像onchange那样需要等到焦点离开textarea控件时才进行字符截取(该属性主要为了用户体验上的效果,没有该属性已经可以真正完成限制字符输入个数的任务.
分享到:
相关推荐
本文将深入探讨jQuery插件中的一个特定应用——“自动扩展文本域”(Auto-Expanding Textarea),该功能常用于创建动态输入框,以适应用户输入的内容增长。 在传统的HTML页面中,文本域(`<textarea>`)通常具有...
在网页开发过程中,经常需要对用户输入的数据进行限制,特别是在文本域(`textarea`)中的输入,为了确保数据的有效性和减轻服务器负担,通常会设置一个最大输入长度。本文将详细介绍如何通过HTML属性及JavaScript...
与单行输入框不同,textarea没有内置的maxlength属性来限制用户输入的字符数。因此,开发者需要采用JavaScript来实现对textarea输入字数的限制。 首先,我们来讨论限制textarea字数的原理。当用户在textarea中输入...
如果文本域中的内容长度超过50个字符,则弹出警告框并阻止表单提交,同时光标聚焦到文本域。 ##### 2. 只允许输入中文 使用正则表达式来过滤掉所有非中文字符。 ```html (/[^\u4E00-\u9FA5]/g,'')"> ``` **解释**...
- `public NotePad()`:构造函数中创建了文本域`textArea`,并添加到窗口中央。接着创建了菜单栏和各个菜单项,以及相关的快捷键设置。每个菜单项都关联了一个事件监听器`listener`,当用户点击菜单项时,会触发...
- **`document.a.b.value.length`**:获取文本域中的内容长度。 - **`alert("不能超过50个字符!");`**:如果超过50个字符,则弹出警告信息。 - **`document.a.b.focus();`**:将光标定位回文本域,便于用户修改。 -...
- `document.a.b.value.length`:获取文本域中的文本长度。 - `alert("不能超过50个字符!")`:如果超过50个字符,则弹出提示。 - `document.a.b.focus()`:将焦点移回文本域,便于用户修改。 - `return false`...
2. 在网页中插入文本的方式灵活多样,可以直接输入,也可以从外部文档复制粘贴,还可以插入水平线和特殊字符,以增强网页的视觉效果和功能性。 3. IP地址的A类和B类通常用于公共网络,C类则常用于小型网络。D类用于...
这个程序提供了基本的文字编辑功能,如新建、打开、保存、剪切、复制、粘贴、查找、替换以及选择全部等操作。让我们一步步剖析源代码,理解其背后的逻辑和设计。 首先,`NotePad` 类继承自 `JFrame`,这意味着它是...