这篇文章主要介绍了jquery如何实现限制textarea输入字数,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。
示例如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>textarea 限制字数</title>
<style>
.container{
position: relative;
width: 730px;
}
.container span{
position: absolute;
bottom: 20px;
right: 30px;
}
</style>
</head>
<body>
<div class="container">
<textarea name="content" id="content" cols="100" rows="10"></textarea>
<span>0/10</span>
</div>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script>
$(function(){
/**
* textarea 限制输入字数
* @param string str 类名或ID
* @param number num 限制输入的字数
*/
function limitImport(str,num){
$(document).on('input propertychange',str,function(){
var self = $(this);
var content = self.val();
if (content.length > num){
self.val(content.substring(0,num));
}
self.siblings('span').text(self.val().length+'/'+num);
});
}
//用法示例
limitImport('#content',10);
})
</script>
</body>
</html>
感谢你能够认真阅读完这篇文章,希望小编分享的“jquery如何实现限制textarea输入字数”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。