Heim
Web-Frontend
js-Tutorial
Detailliertes Beispiel einer JQuery-Implementierung zur Begrenzung der Anzahl der Eingabewörter im Textbereich
Web-Frontend
js-Tutorial
Detailliertes Beispiel einer JQuery-Implementierung zur Begrenzung der Anzahl der Eingabewörter im Textbereich
Detailliertes Beispiel einer JQuery-Implementierung zur Begrenzung der Anzahl der Eingabewörter im Textbereich
jquery
实现
限制
Wie begrenzt JQuery die Anzahl der in einen Textbereich eingegebenen Wörter? In diesem Artikel wird hauptsächlich die Methode zur Begrenzung der Anzahl der in den Textbereich eingegebenen Wörter vorgestellt. Interessierte Freunde können darauf verweisen.
Freunde in Not können sich auf die Beispiele beziehen, die ich geschrieben habe. Natürlich hoffe ich, dass jeder rechtzeitig darauf hinweisen kann, damit wir daraus lernen und gemeinsam Fortschritte machen können.
<!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>
<p class="container">
<textarea name="content" id="content" cols="100" rows="10"></textarea>
<span>0/10</span>
</p>
<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>Nach dem Login kopieren
Verwandte Empfehlungen: