jQuery表单序列化 - 只是返回一个空字符串

Question

我没有从序列化我的html表单获取任何数据。这里是形式

<form method="post" action="#" name='basicForm' id='basicForm'> 

<input type="text" name="n_username" id="id_username" class="form-control uname" placeholder='Username' value='test_user' data-msg-required='The input field is required.' data-rule-required='true'/> 

<input type="password" name="n_password" id="id_password" class="form-control pword" placeholder='Password' value='xxxx' data-msg-required='The input field is required.' data-rule-required='true'/>     

<button class="btn btn-success btn-block">Sign In</button> </form> 

，这里是jQuery的

jQuery(document).ready(function(){ 
    $("#basicForm").validate({ 

     submitHandler: function (form) { 
      var request; 
      var $form = $(this); 

      var $inputs = $form.find("input, select, button, textarea"); 

      var serializedData = $form.serialize(); 
      alert (serializedData); <==empty 

      $inputs.prop("disabled", true); 

      request = $.ajax({ 
       url: "./ajax/login.php", 
       type: "post", 
       data: serializedData 
      }); 

      request.done(function (response, textStatus, jqXHR) { 
       // log a message to the console 
       console.log("Hooray, it worked!"); 
       alert(response); 
       //window.location.replace("success.php"); 
      }); 
     } 


    }); //validate 

});//ready 
</script> 

表单中的数据不被序列化。我收到一个空的警报框。另外，AJAX页面上我回发到我的print_r $ _POST数组，并得到这样的：阵列（）

我已经检查了表单元素有这似乎是常见的问题名称。我正在使用这个jQuery版本

验证工作正常。这也适用于您的帮助

var x = $("#id_username").val(); 
var y = $("#id_password").val(); 
request = $.ajax({ 
       url: "./ajax/login.php", 
       type: "post", 
       //data: serializedData 
       data : { 
        username : x, 
        password: y 
        } 

感谢您能给

Answer 1

您在这里打破它......

submitHandler: function (form) { 
    ... 
    var $form = $(this); // <- '$(this)' is meaningless 
    ... 
    var serializedData = $form.serialize(); 
    ... 

有这个范围内没有$(this)，所以你$form是空。

因为代表form对象form争论已经由开发商提供的，这个版本工作得很好......

submitHandler: function (form) { 
    var serializedData = $(form).serialize(); 
    ... 

工作演示：http://jsfiddle.net/gpaf8187/

注意：你”在你的<button>元素中还需要type="submit"，否则验证插件不会接收此事件。