0

请考虑以下非工作 HTML 文档：

<html> 
    <body>
        <form action="" method="GET" onsubmit="return f(this);">
            <input type="text" name="bar" value="" />
            <input type="button" name="foo" value="foo" />
        </form>
    </body>
    <script type="text/javascript">
        function f(x) {
            alert(x.bar);
        }
    </script>
</html>

我想要实现的是，当（a）按下 foo 按钮时；或 (b) 在文本输入具有焦点时按下回车；然后使用 s 文本输入的内容调用函数 f - 否则浏览器应在 f 返回后停留在同一页面上。

我怎样才能做到这一点？

4

2 回答 2

3

您应该使用提交输入而不是按钮输入，并且要从文本输入中获取文本，请使用 value 属性并返回 false 以防止表单提交

<html>
    <body>
        <form action="" method="GET" onsubmit="return f(this);">
            <input type="text" name="bar" value="" />
            <input type="submit" name="foo" value="foo"/>
        </form>
        <script type="text/javascript">
                function f(x)
                {
                    alert(x.bar.value);
                    return false;
                }
        </script>
        </body>
</html>

小提琴

于 2012-07-08T20:19:06.640 回答
0

只是用值而不是表单元素来调用它？

onsubmit="return f(this.bar.value);"

为防止发送该页面，您可以false从f.

但是使用适当的事件处理程序而不是那个 onsubmit-attribute 会更干净。在此处阅读有关它们的更多信息。

<html>
    <body>
        <form id="inputform" action="" method="GET">
            <input type="text" name="bar" value="" />
            <input type="button" name="foo" value="foo"/>
        </form>
        <script type="text/javascript">
        function f(x) {
            alert(x.bar);
        }
        var form = document.getElementById("inputform");
        form.onsubmit = function(event) {
            var x = f(form.bar.value);
            if (!x)
                event.preventDefault();
        };
        </script>
    </body>
</html>
于 2012-07-08T20:13:38.887 回答