需求:输入会员名,一行一个,最多可输入1000个
效果:
html代码:
<div class="control-group">
<label class="control-label"><span style="color: red;">* </span>发送给指定会员</label>
<div class="controls">
<textarea class="span3" name="coupon_desc" style="height:100px;" required="required" id="area"></textarea>
<span class="help-inline">您已输入<span style="color:#F00;" id="areaRows">0</span>个会员名<br />(输入会员名,一行一个,最多可输入1000个)<br /><span style="color:#F00; display:none;" id="errorText">亲,最多可输入1000个</span></span>
</div>
js代码:
<script language="javascript">
//获取回车事件
$('#area').keypress(function(event){
var keycode = (event.keyCode ? event.keyCode : event.which);
var areaRows = $("#area").val().split("\n").length; //获取行数
if(keycode != '' && areaRows<=1001){ //小于一千行
$('#areaRows').html(areaRows);//替换默认数量0
}
else{
$('#errorText').show();//显示错误提示信息
return false;
}
});
//鼠标离开事件
$('#area').blur(function(){
var areaRows = $("#area").val().split("\n").length;
$('#areaRows').html(areaRows);
if($("#area").val() == 0){//如果为空时
$('#areaRows').html(0);//恢复初始值
}
});
</script>
实现效果: