0

jQuery プラグインbgrins/ExpandingTextareas ( github )を実行すると、幅<textarea>100% のテーブル内のタグが期待どおりに機能しません。特に、テキストエリアは垂直方向に希望どおりに拡張されず、テキストエリアの水平位置には、テキストを入力すると変化する不適切なオフセットがあります。

問題を示すサンプル jsFiddleを次に示します。

対応する問題#33 on GitHubもオープンしました。

なぜこれが起こっているのか、そしてそれをどのように修正するのかについての考えは、最も高く評価されます.

4

1 に答える 1

2

テーブルセル内のテキストエリアに関連する問題については、この回答を参照してください。

以下は私があなたの問題の解決策であることを願っています

デモ

html

<table border="1">
<tr>
    <td>One</td>
    <td>Two</td>
    <td id="expand"><textarea placeholder="type here"></textarea></td>
</tr>

CSS

table {
width: 100%;
table-layout: fixed;
}

textarea {
border: none;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;

}

脚本

$("textarea").expandingTextarea({
  resize: function() //callback
  {
     var i=$('textarea').height();

   //inspect the textarea and cell containing it, height difference is 4.

     $('#expand').attr('height',i+4+'px');   
  }
})
于 2013-11-10T20:09:50.683 に答える