自動調整文本區域的大小而無需關注

Question

目前，我有以下代碼可以自動執行我的textarea：

$('textarea').bind('input propertychange', function() {
    $(this).height(50).height(Math.min(370, this.scrollHeight));
});

當我在文本區域並通過按一些鍵更改文本時，此方法效果很好。

我需要的是在通過JavaScript設置區域文本時以及文本區域未聚焦時可以執行相同操作的可能性。 僅在回調中執行相同的代碼（當然具有正確的作用域）不起作用-高度為零。

Answer 1

您可以嘗試觸發事件

$('textarea').on('input propertychange', function() {
    $(this).height(50).height(Math.min(370, this.scrollHeight));
});
$('textarea').trigger('propertychange');

//如果您使用html（）更改textarea內容或追加內容，則可以嘗試類似$（'textarea'）。html（somecontent）; $（'textarea'）。height（$（'textarea'）。scrollHeight）;

Answer 2

執行回調函數后，觸發propertychange函數

$('textarea').trigger('propertychange');

Answer 3

有change和trigger

 $("#i").on('change', function(){ this.style.color = 'red'; }); function f(){ $('#i').trigger('change'); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="i" value="hello" /><br> <button onclick="f()">Run</button> 

Answer 4

我的jQuery解決方案是：

$(document).ready(function(){
    $("textarea").each(function(){
        $(this).height(($(this)[0].scrollHeight) + "px");
    });
    $("textarea").keypress(function(){
        $(this).height(($(this)[0].scrollHeight) + "px");
    });
})

JSFiddle