需求:輸入會員名,一行一個,最多可輸入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>
實現效果: