个人中心
gpt4 book ai didi

Javascript通过函数设置文本框的值，无需重置

转载 作者：行者123 更新时间：2023-12-03 09:04:25 25 4
gpt4 key购买 nike

我的目标是有一个文本框和一个按钮。如果我在文本框中输入“Hello”并按提交按钮，我希望看到文本框填充“World”。

目前文本框的值将在

之间更改 
<html>
   <body>
         <script>
            function validateForm() {
                var x = document.forms["myForm"]["Input"].value;
                if (x == "Hello") {
                    alert("test");
                    document.getElementById("Input").value = "World";
                    alert("test2");
                }
            }
        </script>

        <form name="myForm" action="test.html" onsubmit="return validateForm()" method="post">
        Input: <input type="text" id="Input"><br>
        <input type="submit" value="Submit">
        </form>

   </body>
</html>

最佳答案

问题是表单在验证后立即提交。因此您会再次重定向到 test.html。

如果您不希望发生这种情况，请将 event.preventDefault(); 添加到您的事件处理程序(check out the fiddle 以查看其工作情况):

<html>
   <body>
         <script>
            function validateForm(event) {
                event.preventDefault();

                var x = document.forms["myForm"]["Input"].value;
                if (x == "Hello") {
                    alert("test");
                    document.getElementById("Input").value = "World";
                    alert("test2");
                }
            }
        </script>

        <form name="myForm" action="test.html" onsubmit="return validateForm(event)" method="post">
        Input: <input type="text" id="Input"><br>
        <input type="submit" value="Submit">
        </form>

   </body>
</html>

您可以learn more about event.preventDefault() at MDN .

作为旁注:通常最好使用 addEventListener而不是 onsubmit 属性(更好地分离关注点，可以添加多个事件监听器等)。

关于Javascript通过函数设置文本框的值，无需重置，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32225691/

25 4 0
文章推荐： javascript - 如何检测 iFrame 中点击的单词
文章推荐： amazon-web-services - 从 AWS ApiGateway 重定向到公共(public) ELB
文章推荐： php - 如何在 PHPDoc 中提及属性？
文章推荐： Javascript - 位警报消息 - 获取所有可能的组合
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com