jQueryを使わずにテキストボックスを自動的に展開する方法はありますか？

私はverticalにresizeを設定しましたが、ユーザがテキストボックスを塗りつぶした後、そのサイズが伸びるようにしたいと思います。 jQueryのような外部ライブラリを使わなければこれができますか？jQueryを使わずにテキストボックスを自動的に展開する方法はありますか？

出典

2016-08-03 Samantha J T Star

[動的文字がそれに入るに従って入力タイプテキストテキストボックスの幅を増加させる]の可能な重複（http://stackoverflow.com/questions/20727692/dynamically-increase-input-type text-text-width-to-the-the-e） –

ほぼ。しかし、ここでOPはそれを垂直方向に拡大したいと考えています – jonju

Javascriptは許可されていますか？ – tewathia

これは、すでにここで回答されています：Creating a textarea with auto-resize

<!DOCTYPE html> 
<html> 
<head> 
<title>autoresizing textarea</title> 
<style type="text/css"> 
textarea { 
    border: 0 none white; 
    overflow: hidden; 
    padding: 0; 
    outline: none; 
    background-color: #D0D0D0; 
    resize: none; 
} 
</style> 
<script type="text/javascript"> 
var observe; 
if (window.attachEvent) { 
    observe = function (element, event, handler) { 
     element.attachEvent('on'+event, handler); 
    }; 
} 
else { 
    observe = function (element, event, handler) { 
     element.addEventListener(event, handler, false); 
    }; 
} 
function init() { 
    var text = document.getElementById('text'); 
    function resize() { 
     text.style.height = 'auto'; 
     text.style.height = text.scrollHeight+'px'; 
    } 
    /* 0-timeout to get the already changed text */ 
    function delayedResize() { 
     window.setTimeout(resize, 0); 
    } 
    observe(text, 'change', resize); 
    observe(text, 'cut',  delayedResize); 
    observe(text, 'paste', delayedResize); 
    observe(text, 'drop', delayedResize); 
    observe(text, 'keydown', delayedResize); 

    text.focus(); 
    text.select(); 
    resize(); 
} 
</script> 
</head> 
<body onload="init();"> 
<textarea rows="1" style="height:1em;" id="text"></textarea> 
</body> 
</html>

例：クレジットはpanziに行くhttps://jsfiddle.net/hmelenok/WM6Gq/

、ここで彼を投票：のみCSSとcontentEditable="true"属性でhttps://stackoverflow.com/a/5346855/1540350

出典

2016-08-03 08:49:46 modiX

を。

div { 
display:inline-block; 
border: solid 1px #000; 
min-height: 200px; 
width: 300px; 
}

Demo Here

出典

2016-08-03 08:52:38 Ranjan

jQueryを使わずにテキストボックスを自動的に展開する方法はありますか？

答えて

関連する問題