桜上水日記#2

mixiのAjaxトピで立ってた"Google Spreadsheets"的な入力フォームのTips

textareaや、input type="text"の幅を入力にあわせて動的に変化させる

onkeyupやonkeypressのタイミングでtextareaの内容をspanにコピーして、spanのoffsetWidthをtexareaの幅に設定してやればよい。（ここでは40px余計に幅を取っている)
textareaとspanのフォント指定をまったく同じにしないと、微妙にずれてくる。
実際に使うときは、spanを visibility="hidden" にしてやればよい。

※IEの場合、[textarea].createTextRange().boundingWidthを使う手もある。

function resize() {
var t = document.getElementById("test");// textarea
var s = document.getElementById("hidden_span");// span
s.innerHTML = t.value;
t.style.width = s.offsetWidth + 40 + "px";// 40px余計に幅を取る。
document.getElementById("info").innerHTML = s.offsetWidth + "px";
}

これは便利な・・・
使わせて頂きます。