ajax 加载表单上的 jQuery serialize() 不起作用

Question

我在 ajax 加载的表单上使用 serialize() 时遇到一些问题。

jQuery 代码:

$(document).on("submit", this.id, function(e) {
  e.preventDefault();
  var frm     = e.target.id;
  var frmData = $("#"+frm).serialize();
  console.log(frm);
  console.log(frmData);
});

控制台输出:

1. 登录表单
2. (空文本)

表单本身( Bootstrap ):

<div class="tab-pane active" id="logintab">
  <div class="well">
    <form class="form-horizontal" id="loginForm">
      <div class="control-group">
        <label class="control-label" for="inputEmail">E-mail adres</label>
        <div class="controls">
          <input type="email" id="inputEmail" value="info@domainname.com" placeholder="E-mail adres" data-validation-email-message="Not a valid e-mail address"  required>
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" for="inputPassword">Password</label>
        <div class="controls">
          <input type="password" id="inputPassword" value="test" placeholder="Wachtwoord" data-validation-required-message="Not a valid password"  required>
        </div>
      </div>
      <div class="control-group">
        <div class="controls">
          <button type="submit" class="btn submitbtn"><i class="icon-signin"></i> Inloggen</button>
        </div>
      </div>
    </form>
  </div>
</div>

Answer 1

表单元素需要有一个名称和一个值才能序列化，您的元素没有名称。如果您添加名称:

<input type="email" name="email" id="inputEmail" ......

它工作得很好:

FIDDLE