控制文本框输入长度

最新推荐文章于 2024-01-10 10:15:08 发布

礁岸

最新推荐文章于 2024-01-10 10:15:08 发布

阅读量609

点赞数

分类专栏： js 文章标签：刀耕火种

本文链接：https://blog.youkuaiyun.com/qq_39121810/article/details/103074479

版权

js 专栏收录该内容

8 篇文章

订阅专栏

代码：

/*
*组件：jq实现文本框输入长度
*1、html:<input id="login_mail" type="email" οnkeyup="setLength(this.id,7,64)" size="25">
*         <span id="login_mail_s"></span>
*   (提示的span的ID有“_s“结尾。函数三个必须参数(this.id,最小长度,最大长度))
*    
*2、js
*/

function setLength(id, minLen,maxLen ){
	if(maxLen>=minLen&&id){//最小长度小于最大长度，且id存在，不然alert系统出错
		var con=$('#'+id).val();//获取当前输入的val
		var len=con.length;//获取当前输入的长度

		$('#'+id+'_s').text((con.slice(0,maxLen).length>=minLen?"✔":"✖"));//提示的span中提示信息，如果满足长度则打勾
		
		if(con.slice(0,maxLen).length>=minLen){//为"✔":"✖"设置字体样式
			$('#'+id+'_s').attr("style","color:green");
		}else{
			$('#'+id+'_s').attr("style","color:red");
		}
		if(len>=maxLen){//大于的话截取长度
			$('#'+id).val(con.slice(0,maxLen));
		}
	}else{
		alert("系统出错");
	}
}