如何在ajax成功函数外保存var值？

Question

我想做一些表单验证功能。这里是我的：

<script> 
$(document).ready(function() { 

var myObj = {}; 

$('#username').keyup(function() { 

    id = $(this).attr('id'); 
    validateUsername(id);  

}); 

function validateUsername(id){ 

var username = $("#"+id).val(); 

    $.ajax({ 
     url : "validate.php", 
     dataType: 'json', 
     data: 'action=usr_id&id=' + username, 
     type: "POST", 
     success: function(data) { 

      if (data.ok == true) { 

       $(myObj).data("username","ok"); 

      } else { 


       $(myObj).data("username","no"); 

      } 

     } 
    }); 


} // end validateusername function 


$('#submit').click(function(){ 

    if (myObj.username == "ok") { 

     alert("Username OK"); 

    } else { 

     alert("Username BAD"); 

    } 


}); 




}); // end doc ready 

所以你可以看到，当在文本框中按下一个键时，它检查它是否有效。 “data.ok”回来正确。问题是基于响应，我定义$（myObj）.username。出于某种原因，我无法获得此值在validateusername函数外工作。当点击提交按钮时，它不知道$（myObj）.username的值是什么。

我需要使用这样的事情，因为在页面上多个表单域来验证，我可以这样做：

if (myObj.username && myObj.password && myObj.email == "ok") 

...提交表单前检查我所有的表单字段。

我知道我必须错过一些基本的东西....任何想法？

编辑：解决

我所要做的就是改变VAR MyObj中= {};至myObj = {};和它的魅力。我想我一直在盯着这个屏幕waaaaay太久了！

Answer 1

您没有访问正确存储的数据。进入用户名值是这样的：

$(myObj).data("username") 

资源：

看看jQuery的.data() docs。

Very simple jsFiddle显示如何使用jQuery的.data（）方法正确设置和检索数据。

Answer 2

我会将承诺存储在该全局变量中，然后在提交按钮单击中将事件绑定到完成事件。

$(document).ready(function() { 

var myObj = false; 

$('#username').keyup(function() { 

    id = $(this).attr('id'); 
    validateUsername(id);  

}); 

function validateUsername(id){ 

    var username = $("#"+id).val(); 

    myObj = $.ajax({ 
     url : "validate.php", 
     dataType: 'json', 
     data: 'action=usr_id&id=' + username, 
     type: "POST", 
     success: function(data) { 
      $('#username').removeClass('valid invalid'); 
      if (data.ok == true) { 
      $('#username').addClass('valid'); 
      } 
      else { 
      $('#username').addClass('invalid'); 
      } 
     } 
    }); 


} // end validateusername function 


$('#submit').click(function(){ 

    // if myObj is still equal to false, the username has 
    // not changed yet, therefore the ajax request hasn't 
    // been made 
    if (!myObj) { 
     alert("Username BAD"); 
    } 
    // since a deferred object exists, add a callback to done 
    else { 
     myObj.done(function(data){ 
      if (data.ok == true) { 
       alert("Username BAD"); 
      } 
      else { 
       alert("Username OK"); 
      }    
     }); 
    } 

}); 




}); // end doc ready 

虽然为了防止多个ajax请求同时处于活动状态，但您可能希望为keyup事件添加一些限制。