jquery - jQuery.expandingTextarea 在表格中不起作用

Question

运行 jQuery 插件bgrins/ExpandingTextareas ( github ) 时，<textarea>100% 宽度表格内的标签无法按预期工作。特别是，textarea 没有按需要垂直扩展，并且 textarea 的水平位置具有不正确的偏移量，该偏移量会随着输入文本而改变。

这是一个说明问题的示例 jsFiddle。

我还在GitHub 上打开了一个相应的 issue，#33。

任何关于为什么会发生这种情况以及如何解决它的想法将不胜感激。

Answer 1

请参阅此答案以了解与表格单元格内的 textarea 相关的问题。

以下是我希望是您的问题的解决方案

演示

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');   
  }
})