jQuery AJAX比访问DOM元素要慢

我想检查用户名是否可用于AJAX和jQuery。jQuery AJAX比访问DOM元素要慢

这是注册输入字段

 <tr> 
      <td><input type = "text" id ="new_username"/></td> 
     </tr> 
     <tr> 
     <td></td> 
     <td id ="information"></td> 
    </tr> 
    <input type = "submit" id = "sign-up" value = "Sign up" />

这里是jQuery的部分与阿贾克斯

(function($){ 
$(document).ready(function(){ 
    $('#new_username').blur(function() { 
     var newUsername = $(this).val(); 

     $.post('../registration/check-username.php', 
      { 
       newUsername : newUsername 
      }, function (data) { 
       $('#information').html(data); 
      } 
     ); 
    }); 

    if($("#information").html() != "") { 
     $("#sign-up").attr('disabled', 'disabled'); 
    } else { 
     $("#sign-up").removeAttr("disabled"); 
    }  
}); 
})(jQuery);

如果有任何问题 - “信息” TD得到了一些错误信息。如果用户名是免费的，它是空的，没有任何通知。问题是ajax需要一些响应，而且点击某处会更快 - 这会导致检查不正确。任何想法，如果你明白我的问题？

来源

2013-05-01 Bor

..你可能想尝试并重新clarrify ...如果jQuery是缓慢和你想要的东西更快的JavaScript将提高速度稍如果我不明白你问的 – brendosthoughts 2013-05-01 07:44:49

的问题是如何首先等待ajax响应，然后回答 – Bor 2013-05-01 08:01:03

这是因为$.post是一个异步请求，意味着一旦请求被发送到服务器来验证脚本执行将继续的用户名。在你的情况下，这意味着if条件将在服务器响应之前得到执行，所以解决方案是在回调方法内移动if条件。

而且最好是使用.prop()方法来修改disabled属性

尝试

(function($){ 
    $(document).ready(function(){ 
     $('#new_username').blur(function() { 
      var newUsername = $(this).val(); 

      $.post('../registration/check-username.php', 
        { 
         newUsername : newUsername 
        }, function (data) { 
         $('#information').html(data); 

         $("#sign-up").prop('disabled', data != ""); 
        } 
       ); 
     });   
    }); 
})(jQuery);

来源

2013-05-01 07:45:31

我明确错误地解释了这个问题，如果这是正确的答案 - 我认为问题是提交没有被禁用，直到AJAX响应发生。 – 2013-05-01 09:07:01

@RyanBrodie如果你看看代码，他试图禁用基于'＃information'元素的内容，该元素由ajax调用 – 2013-05-01 09:24:06

填充内容我明白了，但假设他会想要在*期间禁用该按钮*请求防止意外表单提交，从而解释我在回答中使用'beforeSend'方法。不用担心。 – 2013-05-01 10:29:15

你是对的，你需要等待Ajax响应回来。在完全不重构代码的情况下，只需在响应返回时进行检查。你说得对，你需要等待AJAX响应回来。在完全不重构代码的情况下，只需在响应返回时进行检查。

$.post('../registration/check-username.php', 
    { 
    newUsername : newUsername 
    }, function (data) { 
    $('#information').html(data); 
    }).done(function(){ 
    if($("#information").html() != "") { 
     $("#sign-up").attr('disabled', 'disabled'); 
    } else { 
     $("#sign-up").removeAttr("disabled"); 
    } 
    });

来源

2013-05-01 07:49:26 Sinetheta

我认为“它的速度更快只需点击某处”你指的是用户能够点击提交输入已经被验证了。使用$.ajax()beforeSend方法来解决这个问题：

$(document).ready(function(){ 
    $('#new_username').blur(function() { 
    $.ajax({ 
     url: "../registration/check-username.php", 
     data: { 
     newUsername: $(this).val() 
     }, 
     beforeSend: function() { 
     $("#sign-up").attr("disabled","disabled"); 
     }, 
     success: function(data) { 
     $('#information').html(data); 
     if(!data) 
      $("#sign-up").removeAttr("disabled"); 
     } 
    }); 
    }); 
});

来源

2013-05-01 07:51:13

jQuery AJAX比访问DOM元素要慢

回答

相关问题