两个几乎完全相同的表单功能不同

Question

我在两个不同的页面上有两个几乎相同的表单，它们接受用户的姓名和电子邮件地址。当我按下提交按钮时，他们都会调用一个验证器，它可以正常工作，然后两者都应该进行Ajax调用并显示结果。此时，其中一个成功地打电话，另一个只刷新页面。我不确定有什么不同，导致一个人成功工作，另一个失败。有了这个工作，我已经有了一个工作表单，这是我通过javascript生成表单导致的问题。我不知道现在是什么原因造成的。以下是功能函数的内联代码：

<!--// MODAL: INVITE //--> 
<div id="inviteModal" class="modal" style="display: none"> 
    <div class="response"></div> 
    <form id="inviteForm" > 
    <script type="text/javascript" src="/includes/js/jquery-1.7.2.min.js"></script> 
    <script type="text/javascript"> 
    var invites = <?php echo $user->getInvitesLeft(); ?>; 
    </script> 
    </form> 
</div> 

响应是显示来自Ajax调用的响应的地方。我必须稍后使用Javascript生成内容，因为我根据邀请的价值采取了不同的操作。我原本是在生成整个事情，但是我发现我必须有表单标签才能第一次防止刷新问题。这里是产生用户看到的表单代码：

if(invites < 1){ 
     $("#inviteModal").html("You have no invites left. You can get more by increasing your score."); 
    } 
    else{ 
     $("#inviteForm").html("<h2>Please enter the specified information for the friend you wish to invite. </h2>"+ 
     "<p>First: <input type=\"text\" name=\"first\"></p>"+ 
     "<p>Last: <input type=\"text\" name=\"last\"></p>"+ 
     "<p>Email: <input type=\"text\" name=\"email\"></p>"+ 
     "<p><input type=\"submit\" name=\"submit\" value=\"Invite\"></p>"); 
    } 
    $("#inviteModal").css('display', "block"); 
    $("#overlay").css("display", "block"); 

，这里是验证功能：

$("#inviteForm").validate({ 
//Rules for invite validation 
rules: { 
      first: "required", 
      email: { 
       required: true, 
       email: true 
      } 
     }, 
//Messages to print if validation fails 
messages: { 
      first: "Please provide your friend's name.", 
      email: "We cannot contact your friend without a valid email address.", 
     }, 
//What to do when validation succeeds 
submitHandler: function(form) { 
      //Form is valid, make Ajax call 
      $.ajax({ 
      type: "POST", 
      url: '/invite/process', 
      data: $("#inviteForm").serialize(), 
      datatype: "html", 
      success: function(data, textStatus ,XHR) { 
       //alert(data); 

       if(data.indexOf("Thank you") >= 0){ 
        $("#inviteModal .response").text(data); 
        invites -=1; 
       } 
       else{ 
        $("#inviteModal .response").text(data); 
       } 
      } 
      }); //End ajax 
     } //End submitHandler 
}); //End validator 

正如我所说的，这个工作完全正常。这个与刷新的唯一区别在于，无法正常运行的页面不需要登录即可查看，并根据用户是否登录而采取不同的操作。这里是内嵌代码：

<!--// MODAL: INVITE //--> 
<div id="inviteModal" class="modal" style="display: none"> 
<div class="response"></div> 
<form id="inviteForm" > 
<script type="text/javascript" src="/includes/js/jquery-1.7.2.min.js"></script> 
<?php 
if(!$user || $user == null){ //No user logged in, display invite request form instead 
    $loggedin = false; 
} 
else{ //Allow user to invite friends 
    $loggedin = true; 
} 
?> 
</form> 

这里是代码，除了几乎相同，如果一个额外的一层：

if(!loggedin){ 
     $("#inviteForm").html("<h2>Please enter the specified information to request an invitation. </h2>"+ 
      "<p>First: <input type=\"text\" name=\"first\"></p>"+ 
      "<p>Last: <input type=\"text\" name=\"last\"></p>"+ 
      "<p>Email: <input type=\"text\" name=\"email\"></p>"+ 
      "<p><input type=\"submit\" name=\"submit\" value=\"Invite\"></p>"); 
    } 
else{ 
     invites = <?php echo $user->getInvitesLeft(); ?>; 
     if(invites < 1){ 
      $("#inviteModal").html("You have no invites left. You can get more by increasing your score."); 
     } 
     else{ 
      $("#inviteForm").html("<h2>Please enter the specified information for the friend you wish to invite. </h2>"+ 
      "<p>First: <input type=\"text\" name=\"first\"></p>"+ 
      "<p>Last: <input type=\"text\" name=\"last\"></p>"+ 
      "<p>Email: <input type=\"text\" name=\"email\"></p>"+ 
      "<p><input type=\"submit\" name=\"submit\" value=\"Invite\"></p>"); 
     } 
    } 
    $("#inviteModal").css('display', "block"); 
    $("#overlay").css("display", "block"); 

这里是验证：

$("#inviteForm").validate({ 
//Rules for invite validation 
rules: { 
      first: "required", 
      email: { 
       required: true, 
       email: true 
      } 
     }, 
//Messages to print if validation fails 
messages: { 
      first: "Please provide your friend's name.", 
      email: "We cannot contact your friend without a valid email address.", 
     }, 
//What to do when validation succeeds 
submitHandler: function(form) { 
      //Form is valid, make Ajax call 
      if(loggedIn){ //They are inviting a friend 
       $.ajax({ 
        type: "POST", 
        url: '/invite/process', 
        data: $("#inviteForm").serialize(), 
        datatype: "html", 
        success: function(data, textStatus ,XHR) { 
         //alert(data); 

         if(data.indexOf("Thank you") >= 0){ 
          $("#inviteModal .response").text(data); 
          invites -=1; 
          //$("#overlay").css("display", "none"); 
          //$("#inviteModal").fadeOut(5000); 
         } 
         else{ 
          $("#inviteModal .response").text(data); 
         } 
         return false; 
        } 
       }); //End Ajax 
      } 
      else{ //They are requesting an invite for theirself 
       $.ajax({ 
        type: "POST", 
        url: '/invite/request', 
        data: $("#inviteForm").serialize(), 
        datatype: "html", 
        success: function(data, textStatus ,XHR) { 
         //alert(data); 

         $("#inviteModal .response").text(data); 

         return false; 
        } 
       }); //End ajax 
      } 
          return false; 
     } //End submitHandler 
}); //End validate 

再次几乎相同，除了一个额外的if层。那么为什么最底层的页面刷新页面而不是进行Ajax调用，而第一个页面完全正常工作呢？

Answer 1

如何评论那些return false语句在第二个ajax成功回调函数？