javascript - jQuery .submit() 有验证但没有页面刷新

标签 javascript jquery html validation form-submit

我有一个其他人似乎也有的问题,但我无法使用推荐的解决方案(即“return false;”)。任何帮助都会很棒!

描述:

提交表单后,我想验证输入的格式是否正确(即 type="email")并启动警报(即“表单已提交”。)没有页面刷新。目前,警报不会出现并且页面会刷新。

测试代码:

<!DOCTYPE html>

<html lang="en">
    <head>
        <!-- JavaScript -->
        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    </head>

    <body>
        <!-- Form -->
        <form>
            <input type="email" placeholder="Email" value="" size="25px" required="required" id="userEmail">
            <button type="submit" id="submit">Submit</button>
        </form>

        <!-- Alert on Submission -->
        <script>
            console.log("Ready to Go!");
            $('#submit').submit(function () {
                alert("Form submitted.");
                return false;
            });
        </script>
    </body>
</html>

最佳答案

你会想要捕获 submit形式的事件。没有 submit按钮上的事件。

        $('form').submit(function () {
            if (*everything ok*) {
                alert("Form submitted.");
            } else {
                return false;
            }
        });

理想情况下,您会帮助识别您的 <form> ,带有 ID 或类,即:

<form id="xyz-form">

然后将您的选择器更改为:

$('#xyz-form').submit(...);

现在这只是为了在出现错误时阻止表单提交。当return false;不是提交回调采用的路径,您的页面刷新。如果您想在不刷新的情况下将数据提交到服务器,则需要采用不同的方法。

关于javascript - jQuery .submit() 有验证但没有页面刷新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26245220/

相关文章:

javascript - 添加行时,jQuery 数据表滚动到底部

php - 使用 PHP 从 mysql 数据库查询数据

javascript - 使用 Javascript 获取脚本文件的内容

jquery - 如何在 3 秒后显示导航栏?

javascript - 垂直文本滚动 jQuery

javascript - 创建并排放置的 div

html - 如何在占位符属性中设置单个单词的样式

Javascript : How to get multiple span elements by ID?

javascript - 如何自动运行 onclick 事件

javascript - ExtJs 将不同数据从一个存储加载到多个选择