使用 JavaScript 更改 HTML 文本区域答案

【问题标题】：Change HTML textarea with JavaScript使用 JavaScript 更改 HTML 文本区域
【发布时间】：2013-07-14 07:31:31
【问题描述】：

我在 HTML 中有以下代码：

<button onclick="showDescription();">Find book</button>

在附加的 JavaScript 文件中：

function showDescription(){
    document.getElementById("description").value="book";
}

但是，每当我单击按钮时，它只会显示字符串“book”1 秒钟，然后消失。知道出了什么问题吗？

【问题讨论】：

标签： javascript html dom button textarea

【解决方案1】：

您的按钮（大概）位于<form> 内。

按钮的默认类型是submit。

JavaScript 运行
值已更新
表单已提交
页面已重新加载
再次显示初始值

不要使用提交按钮：

<button type="button" onclick="showDescription();">Find book</button>

或者，从您的事件处理程序返回 false：

onclick="showDescription(); return false;"

【讨论】：

【解决方案2】：

我猜那个按钮在表单里面，把它改成：

<button onclick="showDescription();">Find book</button>

到：

<input type="button" onclick="showDescription();" value="Find book" />

按钮具有默认的提交类型，因此如果它在表单元素内，它将提交表单并重新加载页面。

【讨论】：

那行不通。事件处理程序仍然没有返回 false。
是的，你是对的！一旦我将按钮移出表单，它就可以工作。关于showDescription函数，为什么要返回false？
我的错，您必须在事件处理程序中返回 false 或更改元素类型或仅更改为输入。
等等，为什么我们要在这里返回false？
您返回 false 以阻止按钮的默认操作，即提交表单，这将重新加载页面，就像提交表单一样。

【解决方案3】：

试试这个代码：

<!DOCTYPE html>
<html>
    <head>
        <script>
            function showDescription()
            {
                document.getElementById("description").innerHTML="book";
            }
        </script>
    </head>
    <body>

        <button onclick="showDescription();">Find book</button>

        <textarea id="description" rows="4" cols="50">
        </textarea>

    </body>

【讨论】：