控制文本框的字符个数，显示还可输入的字符数代码,JS代码库,德仔网

代码语言

代码分类

【JS】控制文本框的字符个数，显示还可输入的字符数

作者:dezai / 发布于2014/7/24/ 868


	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
	<html>
	<head>
	<title>控制textarea的字符个数</title>
	
	<script language="javascript">
	function LessThan(oTextArea){
	 //获得textarea的maxlength属性
	 var num=oTextArea.getAttribute("maxlength")-oTextArea.value.length
	
	 document.getElementById("txtNum").innerHTML="还可输入的字符数："+num;
	
	 //返回文本框字符个数是否符号要求的boolean值
	 return oTextArea.value.length < oTextArea.getAttribute("maxlength");
	}
	</script>
	</head>
	<body>
	<form method="post" name="myForm1">
	请输入您的姓名:
	<input type="text" name="name" id="name" class="txt" value="姓名" maxlength="10">
	我要留言
	<textarea name="comments" id="comments" cols="40" rows="4" maxlength="50" onkeypress="return LessThan(this);" onchange="return LessThan(this);" onpropertychange="return LessThan(this);">
	</textarea><span id="txtNum"></span>
	
	<input type="submit" name="btnSubmit" id="btnSubmit" value="Submit" class="btn">
	<input type="reset" name="btnReset" id="btnReset" value="Reset" class="btn">
	</form>
	</body>
	</html>

	

	/*说明：
	1、onkeydown监控用户键盘输入并进行字符截取；
	2、onchange防止用户通过复制粘贴功能输入超过指定最大字符数的字符；
	3、onpropertychange针对IE（FF中无效），作用就是当用户通过复制粘贴功能来进行输入时，当粘贴完成的瞬间即进行字符截取，而不是像onchange那样需要等到焦点离开textarea控件时才进行字符截取（该属性主要为了用户体验上的效果，没有该属性已经可以真正完成限制字符输入个数的任务）。*/

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　字符个数　　控制文本框　　字符数　

同语言下

可能有用的

dezai贡献的其它代码(1065)