Ajax 除了这个函数还需要什么答案

【问题标题】：What more is needed for Ajax than this functionAjax 除了这个函数还需要什么
【发布时间】：2010-09-07 06:18:06
【问题描述】：

我有一个为我执行 Ajax 的小型 JS 函数和另一个类似的函数，它将 POST 数据添加到请求中。 Ajax 是一个如此大的话题，有很多关于它的库，我的函数中缺少什么，它是不安全的还是其他令人担忧的问题？

function loadPage(pagePath, displayElement)
{
    var xmlHttp;

    try
    {
        // Firefox, Opera 8.0+, Safari
        xmlHttp=new XMLHttpRequest();
    }
    catch (e)
    {
        // Internet Explorer
        try
        {
            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (e)
        {
            try
            {
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e)
            {
                alert("Your browser does not support AJAX!");
                return false;
            }
        }
    }

    xmlHttp.onreadystatechange=function()
    {
        if(xmlHttp.readyState==4)
        {
            document.getElementById(displayElement).innerHTML = xmlHttp.responseText;
        }
    }

    xmlHttp.open("GET", pagePath, true);
    xmlHttp.send(null);
}

【问题讨论】：

标签： javascript ajax

【解决方案1】：

如果你真的想看看你缺少什么，请阅读他们的 ajax 例程的 jQuery 或 Prototype 源代码。如果 cmets 中有错误编号，请同时查找。

【讨论】：

【解决方案2】：

原型中的相同：

function loadPage(pagePath, displayElement) {
    new Ajax.Updater(displayElement, pagePath);
}

Ajax.Updater in Prototype API

【讨论】：

【解决方案3】：

我从来都不喜欢嵌套的 try/catch 块，所以我会这样做：

var xmlHttp;
if (window.XMLHttpRequest) {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
} else if (window.ActiveXObject) {
  try {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
}

if (xmlHttp) {
  // No errors, do whatever you need.
}

我认为这会奏效。但正如之前提到的 - 为什么要重新发明轮子，使用库。更好的是 - 了解他们是如何做到的。

【讨论】：

【解决方案4】：

jQuery 可能是目前最轻量级的流行库之一。

【讨论】：

【解决方案5】：

我会删除这一行。

alert("Your browser does not support AJAX!")

用他可能听不懂的语言对用户大喊大叫比失败更糟糕。 :-)

【讨论】：

【解决方案6】：

我强烈建议您不要编写自己的 Ajax 代码。相反，请使用 Prototype、Dojo 或任何其他框架。他们已经处理好所有你没有处理的 ReadyStates（2 表示它已发送，3 表示它正在处理中，等等），他们应该逃避你得到的响应，这样你就不会插入潜在的不安全状态javascript或其他东西进入您的页面。

另一个更强大的框架会给你做更多的能力，而不仅仅是使用 innerHTML 来替换 DOM 中的项目。您在此处的函数只能用于将一个元素替换为来自 ajax 调用的响应。您可以使用 Ajax 做更多事情。

【讨论】：