由于中文是占用2个字符,而英文是1个字符,如果我们不分区英文和中文,只要是8个字符
那通过input的maxlength属性就可以完成任务。现有的需求是需要限制用户输入的input中的字符数目,4个中文字符,8个英文字符。则需要通过javascript来判断,用户输入的是英文还是中文,最后截取8个字节。
下面是具体的代码:
function WidthCheck(str, maxLen){
var w = 0;
var tempCount = 0;
//length 获取字数数,不区分汉子和英文
for (var i=0; i<str.value.length; i++) {
//charCodeAt()获取字符串中某一个字符的编码
var c = str.value.charCodeAt(i);
//单字节加1
if ((c >= 0x0001 && c <= 0x007e) || (0xff60<=c && c<=0xff9f)) {
w++;
}
else {
w+=2;
}
if (w > maxLen) {
str.value = str.value.substr(0,i);
break;
}
}
}
调用函数的方式如下:
<input type="text" id="nickname" class="nickname" value="" placeholder="请输入您的名字" onkeyup="WidthCheck(this,8);"/>
这样当用户输入超过8个字节,就不可以再输入了。
分享到:
相关推荐
本文将详细介绍一个用于限制文本字节数的JavaScript源代码程序,并解释其工作原理。 #### 功能描述 该JavaScript函数`limitLength`用于实时限制用户的输入长度,主要功能包括: - 当用户输入超过指定的字节数时,...
因此,限制输入的字节数与限制输入的字符数有所不同,尤其是当涉及到非ASCII字符时。 #### 3. 如何计算字符串的字节长度 在JavaScript中,可以使用特定的函数来计算字符串的字节长度,考虑到Unicode字符的存在。这...
在用户交互方面,有时我们需要对文本框(`<input type="text">`)进行输入限制,例如限制用户能输入的最大字符数或者字节数。这有助于保持数据的一致性和完整性,防止用户提交过长的信息。以下是一个关于如何使用 ...
在JavaScript中,对`textarea`元素进行输入字符串长度限制是一个常见的需求,特别是在处理用户输入时,需要确保数据格式的正确性。在HTML中,`textarea`控件不像`input[type="text"]`那样可以直接通过`maxlength`...
本篇将详细解释两种限制文本框输入长度的方法,包括字符长度和字节数限制,并提供相关示例代码。 ### 1. 字符长度限制 字符长度限制是最直观的方式,即限制用户输入的最大字符数量。在JavaScript中,可以通过监听`...
本文将详细介绍如何通过JavaScript实现表单中限制文本输入的字节数。 #### 二、需求分析 根据题目描述,我们需要实现一个功能,该功能允许开发者指定一个文本输入的最大字节数限制,并在用户输入超出这个限制时...
该函数旨在帮助开发者轻松地在网页表单中实现字节数限制的功能,确保用户输入的内容不会超过指定的最大字节数限制。 #### 三、函数定义及参数解释 ```javascript function limitLength(value, byteLength, title, ...
本文将详细介绍如何使用JavaScript来实现对Form表单中的Input框字符输入限制的功能,具体来说,我们将限制输入的最大长度为20个字符(包括全角字符),或等效于10个汉字。 #### 二、实现原理概述 要实现上述功能,...
在前端开发中,表单验证是一个常见且重要的功能,尤其是在文本输入字段中限制用户输入的字符数和字节数。本文档提供的示例代码演示了如何通过JavaScript限制HTML form表单中input输入框的字符长度,具体地限制为20个...
根据提供的文档内容,本文将详细介绍几种常用的限制用户输入的方法,并通过具体的代码示例来解释如何实现这些功能。 #### 1. 只能输入数字和英文 ```html <input onkeyup="value=value.replace(/[\W]/g,'')" ...
汉字占用的字节数不同于英文字符,因此在设置限制时,可能需要按字符数而非字节数计算。此外,还应考虑特殊字符,如标点符号和空格,这些也可能影响到字数计算。 在设计用户界面时,合理设置输入框字数限制能提高...
在这段关于JavaScript验证控制输入中英文字节长度的示例中,我们可以学到如何使用JavaScript脚本来检测用户输入的字符长度,尤其是在考虑到中英文字符的字节长度不同。下面详细解释了这些知识点: 首先,我们了解到...
例如,在PHP中,`strlen()`函数返回字符串的字节数,而`mb_strlen()`函数则根据指定的字符集计算字符串的实际字符数,更适合处理多字节字符。 总结一下,"文本域限制"涉及到的技术点主要包括: 1. 使用JavaScript...
在网页开发中,限制用户在输入框(Input)中输入的字符长度是一项常见的需求,尤其在数据验证或者信息填写时。本示例中,我们探讨了两种JavaScript方法来实现这一功能,分别针对英文、数字以及中文字符。 1. **...
为了计算 XSS Payload 的长度,我们可以使用 Python 内置函数 len(字符串)来计算对应的字节数。 浏览器审查工具修改源码 ------------------------- 浏览器审查工具是 Web 开发中的一个重要工具,用于检查和修改...
三、文件大小限制的JavaScript实现 1. 获取文件大小 当用户选择文件后,`<input type="file">`标签的`change`事件会被触发。我们可以在这个事件中获取到选中的文件,并通过`FileList`对象的`item`方法获取到`File`...
本文将详细介绍如何使用JavaScript来读取本地文件并将其转换为字节数组。 #### 基本原理 在现代浏览器中,`FileReader` API 提供了读取文件的能力。它支持多种格式的数据读取,其中一种就是将文件内容读取为字节...
例如,即时显示输入框已经被输入的字节数,或者即时读取输入的值来进行搜索引导等。 在了解如何监听输入框值的即时变化之前,我们需要了解onChange 和 onpropertychange 的不同。onChange 在属性值转变时还必需使得...
在JavaScript编程中,有时我们需要对用户输入或者显示的内容进行字数限制,以保持界面的整洁和数据的有效性。本文将详细探讨如何在JavaScript中实现字数限制,并提供一种提示用户字数超限的方法。 首先,我们需要...
在JavaScript中,我们可以使用FileReader API的`readAsArrayBuffer`方法读取文件,然后通过查看返回的ArrayBuffer对象的长度来获取字节数: ```javascript reader.onloadend = function(e) { var arrayBuffer = e....