css - JQuery Mobile 文本区域 : how does it use 'rows' attribute?

Question

我想使用 JQuery Mobile 动态生成具有不同行数的文本区域。我打算为此使用 knockout，将数据绑定(bind)到 rows 属性。

例如这里:http://jsfiddle.net/j7b9A/2/

<label for="textarea-1">5 rows:</label>
<textarea rows="5" name="textarea-1" id="textarea-1"></textarea>

<label for="textarea-2">10 rows:</label>
<textarea rows="10" name="textarea-2" id="textarea-2"></textarea>

但是，JQuery Mobile 似乎忽略了 rows 属性，该属性有据可查:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea ，甚至包含在 JQuery Mobile 自己的文档中:http://view.jquerymobile.com/1.3.1/dist/demos/widgets/textinputs/index.html#Textarea .

此处的评论指出设置高度和宽度会覆盖 rows 属性:https://stackoverflow.com/a/7194692/1061602 .好像是因为jQuery Mobile在textarea展开的时候在做transition。那么 rows 属性是否总是被完全覆盖？

另一个类似的问题在这里:How to make text area to be height of 10 rows fixed? ，但这对我没有帮助，因为我不想固定所有文本区域的高度，我希望它们有所不同，因为它们通常可以使用 rows 属性。

我还注意到，我无法解释的是，在我自己的代码中，一个流氓 style="height: 184px;" 被添加到我的文本区域之一，但没有其他。另一个只使用 50px 的标准样式，如本答案中突出显示的那样:jQuery Mobile and textarea rows - 这似乎表明还有其他事情正在发生，但我还不能用简单的 fiddle 重现这一点。

我已经快速查看了 JQuery Mobile 源代码，但我根本看不到正在使用的 rows 属性？

为一系列绑定(bind)的 JQuery Mobile 文本区域指定行高范围的最佳方法是什么？

Answer 1

所有你需要的是......添加这个

textarea.ui-input-text { height: inherit !important}