展开已经包含文本的文本区域

Question

我已经阅读了这里所有关于 textareas 的帖子 - 是的，我也觉得它已经被打死了......但是我遇到了一个我找不到帖子的情况，它是现在让我发疯了 5 天。

情况：
具有正常显示状态的多个（数百个）文本区域：无根据需要变为可见。
我通过数据库保存正在进行的工作......并重新打开表单以继续输入数据。 （是的，如果文本区域中有数据，则有代码可以更改显示状态 - 但这与情况无关。

我目前有一个非常好的小部件，可以在输入数据时扩展我的 textareas - 我的问题是当我重新打开表单时，textareas 会回到它们的初始高度。

我尝试创建一个函数，该函数通过触发所有文本区域中的 keyup 事件来在表单加载时处理所有文本区域 - 但它不会使它们展开......但是，如果我只是单击该字段然后使用箭头键他们打开了。不幸的是，这不是一个选择......就像我说的数百个文本区域。

这是我为 keyup 事件/触发器获取的代码：

    $("textarea").each(function() {
        $(this).keyup(function() {
            var target = $(this).attr("id");
            var tElement = document.getElementById(target);
            GrowUP(tElement);
        });
    });

    $("textarea").trigger('keyup');

以及我扩展 textareas 的代码：

    function GrowUP(oTextArea){
        var nMaxChars = 2000;
        var nTextLength = oTextArea.value.length;
        setTextAreaHeightWidth(oTextArea);
        if (nTextLength >= nMaxChars){
            oTextArea.value = oTextArea.value.substring(0, nMaxChars);
            return;
        }
    }

    function setTextAreaHeightWidth(oTextArea){
        var nTA5Height = 20;
        var nTextLength = oTextArea.value.length;
        var sTextAreaType = oTextArea.className;
        var nHeight;
        var nWidth;
        if (sTextAreaType.indexOf("long") >= 0){
            nHeight = nTA5Height;
        }
        // setting default height for the text area
        oTextArea.style.height = nHeight + "px";
        if (nTextLength > 0 && oTextArea.scrollHeight >= nHeight){
            oTextArea.style.height = oTextArea.scrollHeight + "px";
            if (navigator.userAgent.indexOf("Firefox") > 0){
                oTextArea.style.height = oTextArea.scrollHeight + 20 +"px";
            }
        }
    }

我愿意接受任何建议。

好的 - 更新： 我找到了一种方法来欺骗 JSFiddle 让数据已经输入到字段中...
只需选中第二个复选框即可让它显示文本区域。 文本区域以初始高度打开 - 我需要扩展高度（如果我编写的代码确实有效，它应该！）

附言在 JSFIDDLE 中，在“Frameworks & Extension”下，您必须确保它显示“No wrap - in”……它会自动将其更改为“On DOM ready”，这不起作用！
这是链接：@ 987654321@

Answer 1

为了快速简单的修复，不要在 afterOnLoad() 函数中触发 keyup 事件，而是在 Summary(obj) 函数中的 switch 语句之后触发它。 这是一个工作小提琴：https://jsfiddle.net/uwzo25fs/1/

一般来说，只需在您停止隐藏相应元素后触发修改元素高度的事件即可。