jQuery.expandingTextarea不在表中工作 [英] jQuery.expandingTextarea not working inside a table

问题描述

运行jQuery插件时 bgrins / ExpandingTextareas （ github ），< textarea> 100％-width内的标签表不能按预期工作。特别是，textarea不会根据需要垂直扩展，并且textarea的水平位置具有不正确的偏移量，该偏移量随着输入文本的变化而变化。

When running the jQuery plugin bgrins/ExpandingTextareas (github), <textarea> tags inside 100%-width tables do not work as expected. In particular, the textarea does not expand vertically as desired, and the horizontal position of the textarea has an incorrect offset that changes as one inputs text.

这是示例jsFiddle 说明问题。

我也有打开了相应的问题， GitHub上的＃33 。

I have also opened a corresponding issue, #33 on GitHub.

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

Any thoughts on why this is happening and how to remedy it would be most appreciated.

推荐答案

请参考关于与表格单元格内的textarea相关的问题，请访问此 回答 。

please refer to this answer for the issue related to textarea inside table cell.

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

below is what i hope is the solution of your problem

DEMO

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

这篇关于jQuery.expandingTextarea不在表中工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！