在 Meteor 中调整文本区域的大小答案

【问题标题】：Resize textarea in Meteor在 Meteor 中调整文本区域的大小
【发布时间】：2014-04-03 18:18:39
【问题描述】：

我正在尝试创建一个编辑页面，用户可以在其中编辑他的内容在一个调整大小以适应内容的文本区域中，我正在使用这个插件来做到这一点：http://www.jacklmoore.com/autosize/

但是当我访问编辑页面时，textarea 不会调整大小以适应内容，只有在我手动刷新页面时才会发生这种情况。代码如下：

<template name="postEdit">
    <textarea autofocus name="content" type="text" value="">{{content}}</textarea>
</template>

Template.postEdit.rendered = function() {
     $('textarea').autosize(); 
};

我也尝试过使用 Meteor.defer，但它不起作用：

Template.postEdit.rendered = function() {
    Meteor.defer(function() {
    $('textarea').autosize();
 });     
};

当我手动刷新页面并且 textarea 最终调整大小时，textarea html 为此发生了变化：

<textarea class="review" name="review" type="text" value="" placeholder="Blablabla" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 664px;"></textarea>

我的代码有问题还是我的方法有问题？

谢谢。

【问题讨论】：

如果在页面加载的时候在浏览器的控制台输入$('textarea').autosize();不工作，说明插件加载不正确。
感谢您的评论，当我在控制台中输入时，它会打印出这个 , ，但是文本区域不会调整大小
当我手动刷新页面并且 textarea 最终调整大小时，textarea html 会为此更改：
如果你这样做会发生什么$('.review').autosize();
问题可能是您在镜像元素和预期的文本区域上都触发了调整大小。不知道你..

标签： jquery meteor meteorite

【解决方案1】：

正如“已知问题和解决方案”Docs of jQuery Autoresize 中所述，您可能想要这样做：

Template.hello.rendered = function(){
    $('textarea').autosize().show().trigger('autosize.resize');
}

【讨论】：

【解决方案2】：

我不是 jQuery 专家，但如果我没记错的话，你可以这样做：

Template.postEdit.rendered = function() {
     $(this.find('textarea')).autosize(); 
};

【讨论】：

【解决方案3】：

实际的问题是调用插件时 DOM 没有完全加载。这应该有效：

$(function(){
    $("textarea").autosize();
});

【讨论】：

谢谢，我在 Template.postEdit.rendered 中试过了，但它不起作用
如果你在脚本标签里试试呢？还要确保插件已实际加载（即检查开发人员工具的资源选项卡）
这样的？将这个脚本放在 main.html 的哪个位置最好？插件已加载
是的，应该可以。你可以把它放在任何你想要的地方，只要它在客户端部分
它不起作用，即使我手动刷新页面也不行：/

【解决方案4】：

试试这个方法

$(document).ready(function(){
 $('textarea').autosize();   
});

【讨论】：

谢谢，我在 Template.postEdit.rendered 中试过了，但它不起作用