HTML表单的action和onsubmit问题

Question

HTML表单的action和onsubmit问题

javascripthtmlformsactiononsubmit

49

我想在一些文本框条目中运行JavaScript用户验证。

我的问题是，我的表单具有在我们网站内转到新页面的操作，并且onsubmit属性从未运行JavaScript函数。

是否有更好的解决方案或可以与以下代码一起使用的方案：注意：如果将操作切换到checkRegistration()，则JavaScript文件已正确编写并正常工作。

这只是同时运行操作和JavaScript的问题。

<form name="registerForm" action="validate.html" onsubmit="checkRegistration()" method="post">
    <!-- Textboxes are here -->
    <!-- And the submit button -->
</form>

- James Brown

你能分享 checkRegistration 吗？ - Arun P Johny

它可以工作，只是检查用户名文本框是否为电子邮件等等。这不是JavaScript中的错误问题。 - James Brown

3个回答

13

尝试

onsubmit="return checkRegistration()"

- Arun P Johny

5

验证函数为什么需要使用return关键字？ - Mooncrater

表单验证脚本的目的是向onsubmit事件处理程序返回一个布尔值（true或false）。 true表示表单将被提交，而false值将阻止表单被提交。 - Amol J

5

尝试：

onsubmit="checkRegistration(event.preventDefault())"

- Hiren Siddhpura

1

为什么？有没有理由认为checkRegistration将消耗event.preventDefault()的结果？ - Nico Haase

1

@NicoHaase：我需要防止表单提交时刷新页面，并使用event.preventDefault()将函数checkRegistration()（或我在这种情况下使用的任何函数）传递给它，这不会破坏脚本并且正好做到了我所需的。 - edison23

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- s3m3n · Accepted Answer

你应该在onsubmit回调函数中返回false来停止提交过程。

<script>
    function checkRegistration(){
        if(!form_valid){
            alert('Given data is not correct');
            return false;
        }
        return true;
    }
</script>

<form onsubmit="return checkRegistration()"...

这里有一个完全可用的示例。只有在您将“google”写入输入框时，表单才会提交，否则它将返回一个错误：

<script>
    function checkRegistration(){
        var form_valid = (document.getElementById('some_input').value == 'google');
        if(!form_valid){
            alert('Given data is incorrect');
            return false;
        }
        return true;
    }
</script>

<form onsubmit="return checkRegistration()" method="get" action="http://google.com">
    Write google to go to google...<br/>
    <input type="text" id="some_input" value=""/>
    <input type="submit" value="google it"/>
</form>