Javascript jQuery.submit（）带验证，不带页面刷新_Javascript_Jquery_Html_Validation_Form Submit

Javascript jQuery.submit（）带验证，不带页面刷新

javascript jquery html validation

Javascript jQuery.submit（）带验证，不带页面刷新,javascript,jquery,html,validation,form-submit,Javascript,Jquery,Html,Validation,Form Submit,我有一个其他人似乎有的问题，但我无法得到推荐的解决方案（即“return false；”）。任何帮助都会很好说明： <!DOCTYPE html> <html lang="en"> <head>  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jq

我有一个其他人似乎有的问题，但我无法得到推荐的解决方案（即“return false；”）。任何帮助都会很好

说明：

<!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>

提交表单时，我希望验证输入的格式是否正确（即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>


提交
log（“准备就绪！”）；
$（'#submit'）。提交（函数（）{
警告（“表格已提交”）；
返回false；
});

为表单提供一个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>


提交
$（'#表单'）。提交（函数（）{
警告（“表格已提交”）；
返回false；
});

为表单提供一个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>


提交
$（'#表单'）。提交（函数（）{
警告（“表格已提交”）；
返回false；
});

您需要捕获表单的

提交事件。按钮上没有submit
事件
        $('form').submit(function () {
            if (*everything ok*) {
                alert("Form submitted.");
            } else {
                return false;
            }
        });

理想情况下，您可以使用ID或类来帮助识别您的
，即：
<form id="xyz-form">

现在，这只是为了在出现错误时阻止表单提交。返回false时不是提交回调所采用的路径，您的页面将刷新。如果要在不刷新的情况下将数据提交到服务器，则需要采用不同的方法。
您需要捕获表单的submit
事件。按钮上没有submit
事件
        $('form').submit(function () {
            if (*everything ok*) {
                alert("Form submitted.");
            } else {
                return false;
            }
        });

理想情况下，您可以使用ID或类来帮助识别您的
，即：
<form id="xyz-form">

现在，这只是为了在出现错误时阻止表单提交。返回false时不是提交回调所采用的路径，您的页面将刷新。如果要在不刷新的情况下将数据提交到服务器，则需要采用不同的方法。
尝试此方法
    $('#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");
});

试试这个
    $('#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函数的事件处理程序可以是form元素或div元素。阅读更多关于j
当用户单击submit按钮时，您可以使用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语句是为简单验证而创建的。对于您的问题范围，我将大部分代码留给您的创造力。但您基本上可以创建一个简单的函数来检查用户输入的错误，如果有错误，请阻止submit按钮的默认提交行为。如果输入不是空的，并且输入没有错误，请提醒用户表单已提交 jQuery中附加到submit函数的事件处理程序可以是form元素或div元素。阅读更多关于j
当用户单击submit按钮时，您可以使用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语句是为简单验证而创建的。对于您的问题范围，我将大部分代码留给您的创造力。但您基本上可以创建一个简单的函数来检查用户输入的错误，如果有错误，请阻止submit按钮的默认提交行为。如果输入不是空的，并且输入没有错误，请提醒用户表单已提交
 除非切换到AJAX帖子，否则页面最终需要刷新。您是否只是试图捕获错误，然后在错误修复后最终提交？为什么要使用提交按钮？为什么不是一个带有点击事件的常规按钮呢？顺便说一句，25px不是输入的有效大小，您只需要25：除非切换到AJAX帖子，否则页面最终需要刷新。您是否只是试图捕获错误，然后在错误修复后最终提交？为什么要使用提交按钮？为什么不是一个带有点击事件的常规按钮？顺便说一句，25px不是输入的有效大小，您只需要25：这仍然会提交表单。这仍然会提交表单。请允许我谦虚地建议$（“#提交”）。最接近的（“表单”）
？@Kyborek：是的，您可以！添加了一些单词来改进选择器。我可以谦恭地建议$（“#提交”）。最近的（“表单”）
？@Kyborek:可以！添加了一些单词以改进选择器。