有没有办法限制textarea(javascript / jQuery)中每行的字符数?

时间:2012-02-01 01:19:59

标签: javascript jquery html css

有没有办法限制textarea中每行的字符数?例如,在textarea的1-3行中,只允许20个字符,但之后的行,允许50个字符。

构造textarea的方式,我只能通过改变宽度来限制每行大约相同数量的字符(因为它是一个盒子的形状)。我不确定是否可以限制每行不同的字符数量。

我问这个是因为我在textarea的顶部有一个图像,当用户键入某些内容时,文本位于图像绝对定位的部分下方。除非可以在文本区域内浮动图像? :

2 个答案:

答案 0 :(得分:4)

使用JavaScript解决此问题的提示

当然,如果你使用JavaScript,你可以。使用jQuery查看以下代码段:

var result = jQuery('#result');
var my_textarea = jQuery('#mytext');
my_textarea.on('keyup', function(event){
    var el = jQuery(this);
    var lines = el.val().split('\n').length;
    var chars = el.val().split('').filter(function(v){
        return v != '\n';
    }).length;
    result.html('You have ' + lines + ' lines and ' + chars + ' chars');
});

(演示在这里:http://jsfiddle.net/tadeck/8krTv/1/

它计算行数和数量。字符数,每行计算字符数没有问题,并且禁用在特定行中添加更多字符的能力。

位于textarea

内的图像

你说textarea中的图像定位可以解决问题。当然你也可以这样做 - 其中一个解决方案是使图像成为textarea的背景,然后从你希望它出现的那一侧更正填充,这样文本就不会溢出图像。

答案 1 :(得分:0)

好的,你想要实现的是什么?你想让文本在图像的顶部,或者你想要它在图像的左边,一个绝对的位置元素突破自然流并将自己置于最亲近的父母身上容器网格具有相对定位。如果可能的话,在jsfiddle.net上发布一段html和css 欢呼声。