javascript - 将旧函数更新至 Jquery 1.11.3

Question

下面的代码通过与 check.php 通信(如果没有错误则回显“OK”)并更改字段 css 类来验证用户名。 它在 jQuery 1.2.6 中正常运行，我尝试了许多 noConflict() 解决方法来让 1.11.3 与它一起运行，但无济于事。我是一个 jQuery(全能)编程新手，但我相信问题出在这段代码中的一个贬值函数中......也许在 $.ajax 位中。

任何有关如何更新 1.11.3(或更好的想法)的建议将不胜感激。

$(document).ready(function() {

  $("#username").change(function() {

    var usr = $("#username").val();

    if (usr.length >= 4) {
      $("#username").addClass("object_thinking");
      $("#status").html('');

      $.ajax({
        type: "POST",
        url: "check.php",
        data: "username=" + usr,
        success: function(msg) {

          $("#status").ajaxComplete(function(event, request, settings) {

            if (msg == 'OK') {
              $("#username").removeClass('object_thinking');
              $("#username").removeClass('object_error');
              $("#username").addClass("object_ok");
              $("#status").html('');
            } else {
              $("#username").removeClass('object_ok');
              $("#username").addClass("object_error");
              $("#status").html("<font color='red'>" + 'Username already in
use</font>');
            }
          });
        }
      });
    } else {
      $("#status").html('<font color="red">The username should have at least  
<strong>4</strong> characters.</font>');
      $("#username").removeClass('object_ok');
      $("#username").addClass("object_error");
    }
  });    

Answer 1

我根本没有测试过这个，但我知道语法是有效的......只是稍微清理了一下你的函数。

$(document).ready(function() {

  var $username = $('#username');
  var $status = $('#status');

  $username.change(function() {

    var usr = $username.val();

    if ( usr.length >= 4 ) {

      $username.addClass('object_thinking');
      $status.empty();

      $.ajax({
        async: false,
        type: 'POST',
        url: 'check.php',
        data: 'username=' + usr
      })
      .done(function(msg) {

        if ( msg === 'OK' ) {

          $username.removeClass('object_thinking').removeClass('object_error').addClass('object_ok');
          $status.empty();

        } else {

          $username.removeClass('object_ok').addClass('object_error');
          $status.html('<span style="color: red;">Username already in
use</span>');

        }

      });

    } else {

      $status.html('<span style="color: red;">The username should have at least <strong>4</strong> characters.</span>');
      $username.removeClass('object_ok').addClass('object_error');

    }

  });

});