本文介绍了使用 jQuery 限制 textarea 中的行数和显示行数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想使用 jQuery:
Using jQuery I would like to:
- 将用户可以在 textarea 中输入的行数限制为一组数
- 显示行计数器,在输入行时更新行数
- 回车键或 算作一行
- Limit the number of lines a user can enter in a textarea to a set number
- Have a line counter appear that updates number of lines as lines are entered
- Return key or would count as line
$(document).ready(function(){
$('#countMe').keydown(function(event) {
// If number of lines is > X (specified by me) return false
// Count number of lines/update as user enters them turn red if over limit.
});
});
<form class="lineCount">
<textarea id="countMe" cols="30" rows="5"></textarea><br>
<input type="submit" value="Test Me">
</form>
<div class="theCount">Lines used = X (updates as lines entered)<div>
在这个例子中,假设允许的行数限制为 10.
For this example lets say limit the number of lines allowed to 10.
推荐答案
html:
<textarea id="countMe" cols="30" rows="5"></textarea>
<div class="theCount">Lines used: <span id="linesUsed">0</span><div>
js:
$(document).ready(function(){
var lines = 10;
var linesUsed = $('#linesUsed');
$('#countMe').keydown(function(e) {
newLines = $(this).val().split("
").length;
linesUsed.text(newLines);
if(e.keyCode == 13 && newLines >= lines) {
linesUsed.css('color', 'red');
return false;
}
else {
linesUsed.css('color', '');
}
});
});
小提琴:http://jsfiddle.net/XNCkH/17/
这篇关于使用 jQuery 限制 textarea 中的行数和显示行数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!