Question

人们建议我将这段代码转换为jquery，但是如何以及在哪里，有没有工具或者你是如何做到这一点以及为什么XMLHttpRequest对jQuery不好？

我有这段代码：

function showVal(str) {
  if (str == "") {
    document.getElementById("txtHint").innerHTML = "* Please type in School Name.";
    return;
  }

  if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
  } else {// code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }

  xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4) {
      if (xmlhttp.status == 200) { // break this into 2 statements so you can handle HTTP errors
        document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
      } else {
        document.getElementById("txtHint").innerHTML = "AJAX Error (HTTP "+xmlhttp.status+")";
      }
    }
  }; // functions declared in this way should be followed by a semi colon, since the function declaration is actually a statement.

  // encodeURIComponent() does all the escaping work for you - it is roughly analogous to PHP's urlencode()

  // xmlhttp.open("GET","ajaxFuncs2.php?q="+encodeURIComponent(str),true);
  xmlhttp.open("GET","ajaxFuncs2.php?q="+encodeURIComponent(str),true);

  xmlhttp.send();
}

Answer 1

如果你真的想要，转换会使你的代码更加紧凑......但是增加了对jQuery依赖的惩罚。就个人而言，如果您对这个相对简单的功能处理跨浏览器问题感到满意，我认为没有理由将其转换。

话虽如此，转换起来相对容易：

function showVal(str){
    if(str == ''){
        $('#txtHint').html("* Please type in School Name.");
        return;
    }

    $.get({
        url: 'ajaxFuncs2.php?q='+encodeURIComponent(str),
        success: function(data){ $('#txtHint').html(data); },
        error: function(){ $('#txtHint').html('AJAX Error'); }
    });
}

......或左右

Answer 2

您可以使用jQuery's AJAX engine重写它。这应该是一件容易的事。

但是你必须问自己一个古老的问题：我应该修复那些没有破坏的东西吗？

使用$.ajax它看起来像这样：

function showVal(str){ 
    if(str == null || str == ''){ 
        $('#txtHint').html('* Please type in School Name.');
    }
    else {
        $.ajax({ 
                url: 'ajaxFuncs2.php?q='+encodeURIComponent(str), 
                success: function(data, textStatus, jqXHR){ $('#txtHint').html(data); },
                error: function(request, status, error){ $('#txtHint').html('AJAX Error (HTTP ' + status + ')'); } 
            }); 
    }
}

如何将普通的javascript代码转换为jQuery

2 个答案: