用于动态扩展textarea的Prototype插件 [英] Prototype plugin for dynamically expanding textarea

问题描述

有没有人知道一个好的原型插件，它允许textareas根据它们中有多少文本自动扩展/收缩（例如，添加一条线，区域变大，一条线被移除，它会变小）？ / p>

我需要一个可以免费使用的（例如某种形式的GPL类型许可证）。

解决方案

这使用原型：

 < textarea id ='t1'cols =40rows = 7style ='overflow：hidden; font-size：14px; font-family：Times New Roman，Times，serif'>< / textarea> 
< script type =text / javascript> 
函数activateResize（element）{
 Event.observe（element，'keyup'，function（）{
 updateSize（element）
}）; 
 updateSize（element）
} 
 
函数updateSize（element）{
 //如果出现滚动条，请将其放大，除非它比用户的浏览器区域大。 
 if（Element.getHeight（element）< $（element）.scrollHeight&& Element.getHeight（element）< document.viewport.getHeight（））{
 $（element）.style .height = $（element）。getHeight（）+ 15 +'px'
 if（Element.getHeight（element）< $（element）.scrollHeight）{
 window.setTimeout（updateSize（ '+ element +'），5）
} 
} 
} 
 
 activateResize（'t1'）
< / script> 
  

Does anyone know of a good plugin for prototype which allows textareas to automatically expand / contract based on how much text there is in them (e.g. a line is added the area gets bigger, a line is removed it gets smaller)?

I need one thats free to use (e.g. some form of GPL type license).

解决方案

This uses Prototype:

<textarea id='t1' cols="40" rows="7" style='overflow:hidden;font-size:14px;font-family:"Times New Roman", Times, serif'></textarea>
<script type="text/javascript">
function activateResize(element) {
    Event.observe(element, 'keyup', function() {
      updateSize(element)
    });
    updateSize(element)
}

function updateSize(element) {
   //if scrollbars appear, make it bigger, unless it's bigger then the user's browser area.
    if(Element.getHeight(element)<$(element).scrollHeight&&Element.getHeight(element)<document.viewport.getHeight()) {
        $(element).style.height = $(element).getHeight()+15+'px'
        if(Element.getHeight(element)<$(element).scrollHeight) {
            window.setTimeout("updateSize('"+element+"')",5)
        }       
    }
}

activateResize('t1')
</script>

这篇关于用于动态扩展textarea的Prototype插件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！