`
robinrain
  • 浏览: 59833 次
  • 性别: Icon_minigender_1
  • 来自: 威海
社区版块
存档分类
最新评论

JS限定输入文字的输入上限

 
阅读更多
 /**
  *限定输入文字的输入上限,超出上限自动剔除并弹窗提示,集成字数统计
  *@auther:CQL
  *@param obj:this
  *@param maxLength:制定的当前文字输入框的输入长度
  *@param message:制定的超限提示(可以为空)
  *@param messageCountId:字数统计元素的id(可以为空)
  *
  *Example:
  * <textarea   field="xxxx" onkeyup="limitLengthAdvance(this,5,'','messageCountId')"></textarea>
  * </br><span style="color: red">已输入 </span><font color="#FC0505"><b><span id="messageCountId"> 0</span></b></font><span style="color: red">&nbsp;个字</span>
  * 
  */
 function limitLengthAdvance(obj,maxLength,message,messageCountId){
 	var curLength=obj.value.length;
 	var curValue=obj.value;
 	if(curLength>maxLength){
 		if(message==undefined||message==""){
 			L5.Msg.alert('提示','最多输入'+maxLength+'个字,超出部分已经被剔除。');
 		}
 		else{
 		  L5.Msg.alert('提示',message);
 		}
 	   obj.value= curValue.substring(0,maxLength);
 	}
 	if(messageCountId==undefined||messageCountId==""){}
 	else{
 		if(curLength>maxLength){
 			document.getElementById(messageCountId).innerText = maxLength;
 		}else{
 			document.getElementById(messageCountId).innerText = curLength;
 		}
 	}
 }


/**
 *js控制输入文字长度(推荐)
 *BY:CQL
 *obj:this
 *maxLength:制定的当前textarea的文字个数
 *message:制定的超限提示(可以为空)
 *EX:
 *有提示的:
 * onkeyup="limitLength(this,15,'输入文字超过15个,请重新输入!')"
 *没有提示的:
 * onkeyup="limitLength(this,15)"
 */
function limitLength(obj,maxLength,message){
	var curLength=obj.value.length;
	var curValue=obj.value;
	if(curLength>=maxLength){
		if(message==undefined||message==""){}
		else{
		   alert(message);
		}
	   obj.value= curValue.substring(0,maxLength-1);
	}
}

 

分享到:
评论

相关推荐

    js实现文本框输入文字个数限制代码

    通常情况下,文本框输入的文字个数并不是无限制的,一般都会限定一个输入最高上限,较为人性化的网站可能会有可输入字数倒计效果,比如还剩余20可以输入这样的提示,下面就通过一个实例介绍一下如何实现此效果。...

    jQuery字符插件之适合留言板的jquery文本框输入字符限制插件下载

    3. **阻止输入**:一旦达到设定的字符上限,插件可以阻止用户继续输入,确保数据不会超出限制。 4. **自定义配置**:开发者可以根据需求调整插件的参数,比如设置字符限制的数值、提示信息的位置和样式、超过限制后...

    手机端textarea中输入字数监控

    这种功能的应用场景非常广泛,例如在填写表单、评论区输入文字限制等情况下,能够有效地指导用户正确填写信息。 #### 关键概念解析 1. **textarea**:HTML5中用于创建多行文本输入控件的元素。 2. **input事件**:...

    textarea限制长度插件

    1. **实时监测**:当用户在textarea中输入文字时,插件会实时计算已输入的字符数,并显示剩余可输入的字符数。 2. **字符数限制**:开发者可以通过配置参数设置textarea的最大字符数。一旦达到限制,用户将无法继续...

    文本限制长度或字符

    2. `jquery-1.11.0.min.js`:这是一个jQuery库的压缩版本,jQuery是广泛使用的JavaScript库,用于简化DOM操作和事件处理,包括处理用户输入的文本。 3. `fm.validator.js`:这个文件很可能是一个自定义的验证插件,...

    原生js打字小游戏.zip

    1. HTML结构:游戏界面通常由一个输入框(用于用户输入文字)、显示待打单词的区域、计分板、时间显示等组成。HTML元素的布局和样式可以通过CSS进行定制,以创建吸引人的游戏界面。 2. JavaScript基础:原生JS是...

    微博文本字数带提示限制

    在IT行业中,文本输入限制是一种常见的功能,特别是在社交媒体平台如微博上。微博文本字数带提示限制的效果是为了确保用户能够快速、有效地传达信息,同时保持平台的信息整洁与易读性。这种功能通常会实时监测用户...

    Javascript表单验证大全

    这段代码利用了正则表达式 `[^\u4E00-\u9FA5]` 来匹配非汉字字符,并通过 `replace()` 方法将这些非汉字字符替换为空,从而实现了只能输入汉字的功能。 #### 三、判断是否为英文字符 在某些情况下,可能只需要用户...

    JavaScript中统计Textarea字数并提示还能输入的字符

    首先,我们需要在HTML中创建一个Textarea元素,用于用户输入文字,并设置两个事件监听器:onkeydown和onkeyup。这两个事件分别在用户按下键盘键和释放键盘键时触发。此外,我们还需要一个span元素,用于动态显示剩余...

    仿QQ空间发布说说

    - 布局设计:需要创建一个类似于QQ空间的发布界面,包含输入文字的文本框和上传图片的区域。UI应该直观易用,符合用户习惯。 - 自适应布局:为了适应不同设备和屏幕尺寸,应采用响应式设计,确保在手机和平板电脑...

    CSharp正则表达式样例示范

    - **限制只能输入全角字符**:`onkeyup="value=value.replace(/[^\uFF00-\uFFFF]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\uFF00-\uFFFF]/g,''))"` ...

    C#的正则表达式

    - **解释**:该段JavaScript代码用于限制文本框只能输入数字和英文字符。`[\W]`表示匹配非单词字符。 29. **利用正则表达式从URL地址中提取文件名的JavaScript程序** - **示例**:`s=...

    正则表达式匹配.doc

    - 示例:限制只能输入中文:“`onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))"`” ...

    弹出自定义搜索带历史记录

    这通常包括但不限于输入框的外观设计(如边框、背景色、文字提示)、输入验证(如输入类型检查、字符限制)、以及搜索按钮的行为(如点击触发的事件)等。例如,你可以创建一个具有自动补全功能的搜索框,根据用户...

    jquery实现textarea输入框限制字数的方法

    &lt;script type="text/javascript" src="jquery-1.8.2.min.js"&gt; &lt;script type="text/javascript"&gt; $(function(){ $("#weibo").keyup(function(){ var len = $(this).val().length; if(len &gt; 139){ $(this).val($...

    js实现上传图片并显示图片名称

    7. 容量限制:代码中的逻辑还考虑了图片上传数量的限制,比如代码中有一个判断条件,检查“.img_list”元素中的子元素数量是否已经达到上限(此处为5张图片),以防止过多的图片占用过多的页面资源。 8. 异常处理:...

Global site tag (gtag.js) - Google Analytics