多个文本区域-解网

问：

如何将多个 TextAreas 重置为其默认值（文本）？不给他们特定的课程可能吗？我只找到了一个文本输入的解决方案，但在 1 页上有多个文本区域没有成功，按功能重置。

<html>  
<body>
<textarea rows="1" cols="30">Hello World</textarea><br/>
<textarea rows="1" cols="30">Hello Second World</textarea><br/>

<button onclick="reset()">Reset</button>

<script>

            function reset() {
                document.querySelectorAll('textarea').value = <!--Default Value-->
                            }
                           
</script>

</body>
</html>

JavaScript 文本区域

Address:<br>
<textarea id="myTextarea">
342 Alvin Road
Ducksburg</textarea>

<textarea id="myTextarea2">
Value 2</textarea>

<p>Click the button to change the contents of the text area.</p>

<button type="button" onclick="myFunction()">Try it</button>

<script>
function myFunction() {
  document.getElementById("myTextarea").value = "Txt1";
  document.getElementById("myTextarea2").value = "Txt2";
}
</script>

编辑以匹配注释中的用例

根据 MDN 的说法，textarea 没有 value 属性。

当页面加载时，textarea 的默认值是介于某个值之间的任何值。因此，当用户更改它时，我们没有办法找到原始值。

为了克服这个问题，我们需要某种机制来存储默认值

在你的例子中，如果你有很多元素（Textareas），使用数据属性将帮助我们在页面加载和用户更改值后识别默认值

因此，请使用以下示例

<textarea rows="1" cols="30" data-default="Default Val">Hello World</textarea><br/>
<textarea rows="1" cols="30" data-default="Default Val1">Hello World</textarea><br/>
<textarea rows="1" cols="30" data-default="Default Val2">Hello World</textarea><br/>

<button onclick="reset()">Reset</button>

<script>

            function reset() {
                
                var textareas = document.querySelectorAll('textarea');
                    for(i =0; i < textareas.length; ++i){
                        textareas[i].value = textareas[i].getAttribute('data-default');
                    }   
                }
                           
</script>

多个文本区域

Multiple textareas

评论

评论

编辑以匹配注释中的用例

评论