Отправка формы AJAX, когда ввод используется для отправки

Question

У меня есть дизайнер, настаивающий на одном поле формы, отправленном нажатием Enter, сообщением, созданным AJAX, и ответом, представленным Fancybox.

Проблема в том, что return false не препятствует отправкестр.

Что я там не так делаю?

<form id="home_stay_informed_form">
<input name="informed_email" id="home_informed_email" value="Enter your email address..." />
</form>


$('#home_stay_informed_form').submit(function() {
  var reg = new RegExp(/^\S+@\S+\.\S+$/);
  var em = $("#home_informed_email").val();
  if (!reg.test(em)) {
  alert('Please correct your email address.');
  $("#home_informed_email").focus();
    return false;
  } else {
  $.ajax({
    type: "POST",
    url: 'listSubscribe.php',
    data : 'email=' + em,
    success: function(msg) {
     $("#home_stay_informed_form_msg").fancybox({
    'titlePosition'  : 'outside',
    'transitionIn'  : 'none',
    'transitionOut'  : 'none'
   });
    $("#home_informed_email").val('Enter your email address...');
    return false;
    }
  });   
  }
});

Answer 1

return false необходимо сделать непосредственно в обработчике submit, например:

$('#home_stay_informed_form').submit(function() {
  var reg = new RegExp(/^\S+@\S+\.\S+$/);
  var em = $("#home_informed_email").val();
  if (!reg.test(em)) {
    alert('Please correct your email address.');
    $("#home_informed_email").focus();
  } else {
    $.ajax({
      type: "POST",
      url: 'listSubscribe.php',
      data : 'email=' + em,
      success: function(msg) {
        $("#home_stay_informed_form_msg").fancybox({
          'titlePosition'  : 'outside',
          'transitionIn'  : 'none',
          'transitionOut'  : 'none'
        });
        $("#home_informed_email").val('Enter your email address...');
      }
    });   
  }
  return false;
});

Ваш обработчик success не запустится, пока ответ сервера не вернется, поэтому ваша функцияфактически возвращает undefined для этого else заявления ... и что return false внутри не имеет никакого эффекта.Помещение его в обработчик submit напрямую, как описано выше, будет делать то, что вы хотите, не допуская отправки формы.параметр события здесь:

$('#home_stay_informed_form').submit(function(e) {

И замена return false на

e.preventDefault();