的jQuery $就帖子多次（一个额外的后以后每次提交）

Question

在我忘记密码的形式，jQuery的AJAX后触发多次（每次使用后多了一个提交）。因此，如果用户输入3次无效的电子邮件，然后输入有效的电子邮件，则用户将获得4个密码更改的电子邮件。似乎每次发生错误时都会堆叠事件，所有这些事件都会在下次提交时被解雇。这是我所有的相关代码。我究竟做错了什么？

JS

RetrievePassword = function() { 
     var $popup = $("#fancybox-outer"); 
     var form = $popup.find("form"); 
     form.submit(function (e) { 
      var data = form.serialize(); 
      var url = form.attr('action'); 
      $.ajax({ 
       type: "POST", 
       url: url, 
       data: data, 
       dataType: "json", 
       success: function (response) { 
        ShowMessageBar(response.Message); 
        $.fancybox.close() 
       }, 
       error: function (xhr, status, error) { 
        ShowMessageBar(xhr.statusText); 
       } 
      }); 
      return false; 
     });  
    }; 

MVC控制器/ ACTION

[HandlerErrorWithAjaxFilter, HttpPost] 
     public ActionResult RetrievePassword(string email) 
     { 
      User user = _userRepository.GetByEmail(email); 

      if (user == null) 
       throw new ClientException("The email you entered does not exist in our system. Please enter the email address you used to sign up."); 

      string randomString = SecurityHelper.GenerateRandomString(); 
      user.Password = SecurityHelper.GetMD5Bytes(randomString); 
      _userRepository.Save(); 

      EmailHelper.SendPasswordByEmail(randomString); 

      if (Request.IsAjaxRequest()) 
       return Json(new JsonAuth { Success = true, Message = "Your password was reset successfully. We've emailed you your new password.", ReturnUrl = "/Home/" }); 
      else 
       return View();   
     } 

HandlerErrorWithAjaxFilter

public class HandleErrorWithAjaxFilter : HandleErrorAttribute 
    { 
     public bool ShowStackTraceIfNotDebug { get; set; } 
     public string ErrorMessage { get; set; } 

     public override void OnException(ExceptionContext filterContext) 
     { 
      if (filterContext.HttpContext.Request.IsAjaxRequest()) 
      { 
       var content = ShowStackTraceIfNotDebug || filterContext.HttpContext.IsDebuggingEnabled ? filterContext.Exception.StackTrace : string.Empty; 
       filterContext.Result = new ContentResult 
       { 
        ContentType = "text/plain", 
        Content = content 
       }; 

       string message = string.Empty; 
       if (!filterContext.Controller.ViewData.ModelState.IsValid) 
        message = GetModeStateErrorMessage(filterContext); 
       else if (filterContext.Exception is ClientException) 
        message = filterContext.Exception.Message.Replace("\r", " ").Replace("\n", " "); 
       else if (!string.IsNullOrEmpty(ErrorMessage)) 
        message = ErrorMessage; 
       else 
        message = "An error occured while attemting to perform the last action. Sorry for the inconvenience."; 

       filterContext.HttpContext.Response.Status = "500 " + message; 
       filterContext.ExceptionHandled = true; 
       filterContext.HttpContext.Response.TrySkipIisCustomErrors = true; 
      } 
      else 
      { 
       base.OnException(filterContext); 
      } 
     } 

     private string GetModeStateErrorMessage(ExceptionContext filterContext) 
     { 
      string errorMessage = string.Empty; 
      foreach (var key in filterContext.Controller.ViewData.ModelState.Keys) 
      { 
       var error = filterContext.Controller.ViewData.ModelState[key].Errors.FirstOrDefault(); 
       if (error != null) 
       { 
        if (string.IsNullOrEmpty(errorMessage)) 
         errorMessage = error.ErrorMessage; 
        else 
         errorMessage = string.Format("{0}, {1}", errorMessage, error.ErrorMessage); 
       } 
      } 

      return errorMessage; 
     } 

    } 

这里有更多的JS。我使用fancybox插件作为我的灯箱。 “检索密码”链接位于登录灯箱中。

$(document).ready(function() { 

    $(".login").fancybox({ 
     'hideOnContentClick': false, 
     'titleShow': false, 
     'onComplete': function() {  

      $("#signup").fancybox({ 
       'hideOnContentClick': false, 
       'titleShow':false, 
       'onComplete': function() { 

       } 
      }); 

      $("#retrievepassword").fancybox({ 
       'hideOnContentClick': false, 
       'titleShow': false, 
       'onComplete': function() { 

       } 
      }); 
     } 
    }); 

}); 

Answer 1

我不是一个jQuery的专家，但它似乎对我来说，每一次的fancybox的onComplete火灾，添加（另一个）事件处理程序#retrievepassword和#signup ......我失去了休息在页面中的HTML，所以我不知道是否/何时登录对话框内容加载，但以下可能会更好地工作：

$(document).ready(function() { 

    $(".login").fancybox({ 
     'hideOnContentClick': false, 
     'titleShow': false, 
     'onComplete': function() {  

     } 
    }); 

    $("#signup").fancybox({ 
     'hideOnContentClick': false, 
     'titleShow':false, 
     'onComplete': function() { 

     } 
    }); 

    $("#retrievepassword").fancybox({ 
     'hideOnContentClick': false, 
     'titleShow': false, 
     'onComplete': function() { 

     } 
    }); 
});