单击后使用文本区域打开对话框答案

【问题标题】：Open Dialog with textarea after Click单击后使用文本区域打开对话框
【发布时间】：2020-06-30 15:05:54
【问题描述】：

我正在创建一个 Java Spring Web 应用程序，其中有一个供用户填写的表单。在表单中，我有一个 textarea 输入类型作为字段之一。在查看表单时，我只希望 textarea 显示大约 50 个字符，然后以 '...' 或其他内容结尾。但是，该字段本身最多可以包含 250 个字符。所以，我想要发生的是，如果用户单击该字段，则整个文本区域会在一个单独的对话框中打开，以便用户可以看到可能在正常字段视图中被截断的所有字符。我没有太多要开始的内容，但对于 JavaScript，我只会给出一个基础：

    document.getElementById('hwDescription').onclick = function () {
        ...
    }

而 HTML 元素是：

<form:input id="hwDescription" type="text" class="form-control" path="hwDescription"
                    name="hwDescription" placeholder="Description" />

任何帮助将不胜感激。谢谢！

【问题讨论】：

标签： javascript html onclick modal-dialog textarea

【解决方案1】：

我将最小尺寸设置为 10 看预览，这可能对你有用。

document.getElementById('hwDescription').onclick = function () {
    
    this.classList.add("large");
        
    this.onkeypress = this.onkeydown = function() {
        this.size = ( this.value.length > 10 ) ? this.value.length : 10;
    };


}

.large { 
   border: 1px solid #0d0;
}

&lt;input id="hwDescription" type="text" class="form-control short" path="hwDescription" name="hwDescription" placeholder="Description" /&gt;

【讨论】：

抱歉，这不是我想要的。我正在寻找更多要在单独的对话框中展开的文本区域。