<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>collapsible demo</title>
<style>
.textarea{
float: left;
width:200px;
font-size: 12px;
font-weight: normal;
color: #666;
min-height:20px;
word-wrap:break-word;/*为了在ie和FF顺利换行，加上word-wrap*/
overflow-x:hidden;
overflow-y: auto; /*visible (默认), hidden, scroll, 和auto*/
padding: 5px;
line-height: 20px;
white-space:normal;/*换行*/
outline: 0;
}
div[contenteditable]{border:1px solid #ddd;}
</style>
<body>
<div id="info" contenteditable="true" class="textarea">限制文本框个数</div>
<script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(".textarea").keyup(function () {
var _html = $(this).html();
if(_html.length > 100){
$(this).html(_html.substr(0,100));
$(this).blur();
}
})
</script>
</body>
</html>
js方式
$ele.onkeyup = function(){
var _html = this.innerHTML;
if(_html.length > 10){
this.innerHTML = _html.substr(0,10);
this.blur();
}
}
扫一扫
8266
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
