Question

我遇到了其他人似乎有的问题，但我无法获得推荐的解决方案（即“返回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>

Answer 1

您需要捕获表单的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;不是提交回调所采用的路径时，您的网页将刷新。如果要在不刷新的情况下将数据提交到服务器，则需要采用不同的方法。

Answer 2

为您的表单提供ID，并将您的jquery更改为使用#formid。

例如：

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

<script type="text/javascript">
    $('#form').submit(function () {
        alert("Form submitted.");
        return false;
    });
</script>

Answer 3

附加到jQuery中的submit函数的事件处理程序可以是表单元素或div元素。阅读更多关于j Query API的信息当用户点击提交按钮而没有使用jQuery的preventDefault函数的默认提交行为时，您可以实现click事件

console.log("Ready to Go!");
            $('form').submit(function () {
                alert("Form submitted.");
                return false;
            });
$("#submit").click(function(e){
      if (hasError){
          e.preventDefault();
      }
      else{
         alert("success");
      }
 })

为简单验证创建了if和else语句。对于你的问题范围，我将大部分编码留给你的创造力。但您基本上可以创建一个简单的函数来检查用户输入的错误，如果有错误，则阻止提交按钮的默认提交行为。如果输入不为空且输入没有错误，请提醒用户表单已提交。

Answer 4

试试这个

    $('#submit').click(function () {
        alert("Form submitted.");
        return false;
    });

它会完成你想要的。

基本上点击会在提交

之前触发

尝试使用此代码段清理

 console.log("Ready to Go!");

$('#submit').click(function () {
  alert("Form submitted.");
  //return false;
  return true;
});

$("form").submit(function( event ) {
  alert("woot woot");
});

jQuery .submit（）带有验证而没有页面刷新

4 个答案: