文本框字数验证个数 textarea
本人今天写好的一段js的验证。分享下
1
<html>2
<head>3
<script type="text/javascript" src="Jquery.js"> </script>4
<script type="text/javascript" src="StrLeng.js"> </script>5

<script type="text/javascript">
6

$().ready(function()
{7
StrLeng("textarea",100);8
});9
</script>10
</head>11
<body>12

13
<textarea id="textarea" style="height:100px;"></textarea>14
</body>15
</html>
1
function StrLeng(id,leng)2
{3
var dom = $("#"+id);4
var left = SL_getLeft(id)+dom.width()+10;5
var top = SL_getTop(id)+dom.height()-10;6
7
$(document.body).append("<div id=\"strLeng\" style=\"position:absolute;top:"+top+"px; left:"+left+"px;\"><strong id=\"strongColor\" style=\"color:Fuchsia\">"+getBytesLength(dom.val())+"</strong><strong style=\"color:Gray\">/"+leng+"</strong></div>");8
9
dom.keyup(function(){10
$("#strongColor").text(getBytesLength(this.value));11
if(getBytesLength(this.value)>=leng)12
{13
$("#strongColor").attr("style","color:Red");14
}15
else16
{17
$("#strongColor").attr("style","color:Fuchsia");18
}19
});20
}21

22

23
function SL_getLeft(id) {24
25
var obj = $('#'+id)[0];26
var left = obj.offsetLeft;27
var parent = obj.offsetParent;28
29
while(parent) {30
left += parent.offsetLeft;31
parent = parent.offsetParent;32
}33
34
return left35
}36

37
function SL_getTop(id) {38
var obj = $('#'+id)[0];39
var top = obj.offsetTop;40
var parent = obj.offsetParent;41
42
while(parent) {43
top += parent.offsetTop;44
parent = parent.offsetParent;45
}46
47
return top;48
}49

50
function getBytesLength(str) {51
// 在GBK编码里,除了ASCII字符,其它都占两个字符宽52
return str.replace(/[^\x00-\xff]/g, 'xx').length;53
}54

55

图片:

浙公网安备 33010602011771号