jquery submit()不会做任何事情

Question

在使用jquery submit()时遇到问题。问题是它在站点上不起作用，它会将我发送到action url (作为im使用get)，而不是阻止它并在submit()中运行函数。如果在控制台中添加submit()-script就可以了。怎么会这样?

这是我的js文件：

$(function(ready){
  $('#contact-form button')
    .removeClass('disabled')
    .removeAttr('disabled');

  $('#contact-form').submit(function(e){
    alert('????????????????????????????');
    return false;
      e.preventDefault();

      $this = $(this);
      $this.addClass('disabled').attr('disabled', true);
      $('#contact-form img').addClass('showLoader');

      $.post('theme/widgets/contact-form/ajax/send-mail.php', $('#contact-form').serialize(), function(d){
        $this.removeClass('disabled').removeAttr('disabled');
        $('#contact-form img').removeClass('showLoader');

        try {
          $msg = $.parseJSON(d);
        } catch (e) {
          console.log(e, d);
          $msg.error = true;
          $msg.message = "Unknown error occoured. See console for more information.";
        }

        if (!$msg.error) {
          $('#contact-form input').val('');
          $('#contact-form textarea').val('');
        }

        alert($msg.message);
      });
  });
});

这是我的表格：

$html = "<form id='contact-form'>
  <label>".__('name', false, $ld)."</label>
  <input type='text' name='name' /><br />
  <label>".__('email', false, $ld)."</label>
  <input type='text' name='email' /><br />
  <label>".__('body', false, $ld)."</label>
  <textarea name='body'></textarea><br />
  <img src='".THEME."images/ajax-loader-small.gif' />
  <button class='disabled' disabled='disabled'><span>".__('send', false, $ld)."</span></button>
</form>";

为什么jquery提交只在我粘贴到控制台时才反应，而不是在页面加载时反应呢？我没有收到任何javascript错误，我已经尝试了很多不同的jquery版本。

Answer 1

问题是事件没有触发。代码，你说，执行的很好...在手动触发事件之后。事件不能被触发有几个原因...第一种情况通常是因为事件在html被呈现之前就被连接起来了。你可以通过使用委托来解决这个问题，但是我相信(在‘解决’这个问题之后)你的事件不会被触发，因为你连接的事件是在form submission上，而是在you do not have a submit button on your form上。您可能希望尝试使按钮成为提交按钮，或者使代码在单击按钮时触发，而不是在表单提交时触发。

下面是使用delegates的代码

$("body").delegate("#contact-form", "submit", function() {
    alert('????????????????????????????');
    return false;
      e.preventDefault();

      $this = $(this);
      $this.addClass('disabled').attr('disabled', true);
      $('#contact-form img').addClass('showLoader');

      $.post('theme/widgets/contact-form/ajax/send-mail.php', $('#contact-form').serialize(), function(d){
        $this.removeClass('disabled').removeAttr('disabled');
        $('#contact-form img').removeClass('showLoader');

        try {
          $msg = $.parseJSON(d);
        } catch (e) {
          console.log(e, d);
          $msg.error = true;
          $msg.message = "Unknown error occoured. See console for more information.";
        }

        if (!$msg.error) {
          $('#contact-form input').val('');
          $('#contact-form textarea').val('');
        }

        alert($msg.message);
      });
});

jQuery 1.7调用(推荐，委派在1.7中比旧版本更有效)：

$("body").on("submit", "#contact-form", function() {
  //code here
});

Answer 2

我认为你的按钮可能需要一个type=“提交”才能工作。不管怎样，jquery文档就是这么说的

http://api.jquery.com/submit/