Question

如果用户点击按钮，我希望文本框能够展开。我知道我必须使用onclick功能。我知道有很多自动调整文本框的示例，但我希望用户单击它，它会展开，然后在单击按钮缩小后保存该数据。

 <textarea rows="8" cols="80" id="queryText" name="query" requried>
</textarea>

Answer 1

您可以通过修改textarea和cols来更改rows的尺寸。如果要扩展然后缩小回正常大小，可以将它们定义为：

var textarea = document.getElementById("queryText");

var largeRows = "20";
var largeCols = "100";
var normalRows = textarea.rows; // Or smaller if you want this
var normalCols = textarea.cols; // to shrink more than normal.

你可以使用一个按钮来调整大小，更改value或innerHTML来检测你正在扩张或缩小的时间：

HTML 的

<button id="size">+</button>

JS

document.getElementById("size").onclick = function()
{
    if(this.innerHTML == "+") {
        textarea.rows = largeRows;
        textarea.cols = largeCols;
        this.innerHTML = "-"
    } else {
        textarea.rows = normalRows;
        textarea.cols = normalCols;
        this.innerHTML = "+"
    }
}

Here is an example

我认为您不需要保存数据，因为即使您缩小数据或隐藏textarea，它也会存在。但要获取文本，可以textarea.value。并将其保存到变量或localStorage，具体取决于您要执行的操作。

如何用javascript调整textarea大小？

1 个答案: