简体   繁体   中英

Prototype plugin for dynamically expanding textarea

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 (eg a line is added the area gets bigger, a line is removed it gets smaller)?

I need one thats free to use (eg 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>

It's not a plugin, but it's not long: http://www.codelibary.com/JavaScript/Auto%20textarea%20resize.html .

EDIT: found this SO thread

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM