提交表单时jQuery无法接受用户输入

Question

我有以下代码。我需要在他提交表单时检查用户输入（他的电子邮件地址）的验证。如果电子邮件地址的格式不正确，则应显示错误消息。

问题是当我在文本框中输入错误的电子邮件地址并按下提交按钮时，没有任何反应。我曾经使用警报检查代码（我写了alert("Email")）并了解到$("#customerEmail").val() 没有返回值，而我目前在文本框中输入了一个值。可能是什么问题？

<form method="post" action="">
     <input type="text" id="customerEmail"/>
     <br/>
     <input type="submit" id="customerRegister" name="customerRegister"/>
</form>

<?php
  if(isset($_POST['customerRegister'])){
     echo'
    <script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript">
       var EMail=$("#customerEmail").val();
       alert(Email);
       var atpos = EMail.indexOf("@");
       var dotpos = EMail.lastIndexOf(".");
           if (EMail != "")
       {
           if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= EMail.length) 
               {
                   $("#customerEmailSpan").html("wrong email address");
               }
           else if (atpos >= 1 && dotpos >= atpos + 2 && dotpos + 2 < EMail.length)
               document.getElementById("customerEmailSpan").innerHTML = "";
       }
    </script>';
    }
?>

Answer 1

你为什么不做这样的事情而不是混合js和php？

制作一个单独的javascript文件并将js代码放在这里。

您正在声明电子邮件并提醒电子邮件。这可能是一个原因。

(function($){

   //Call the script after document is loaded.
   $(document).ready(function() { 

      //on click event of submit button
      $("body").on("click", "#customerRegister", function(e){

       var EMail = $("#customerEmail").val();

       //This is the mistake you were doing. ie; print Email instead of EMail.
       alert(EMail);
       var atpos = EMail.indexOf("@");
       var dotpos = EMail.lastIndexOf(".");
           if (EMail != "")
       {
           if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= EMail.length) 
               {
                   $("#customerEmailSpan").html("wrong email address");
               }
           else if (atpos >= 1 && dotpos >= atpos + 2 && dotpos + 2 < EMail.length)
               $("#customerEmailSpan").val("");
       }


       });
    });

      }(jQuery));