Question

我有一个小的JS函数，它为我做了Ajax，另一个像它一样将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);
}

Answer 1

我强烈建议您不要使用自己的Ajax代码。相反，使用Prototype，Dojo或任何其他框架。他们负责处理你没有处理的所有ReadyStates（2表示它已被发送，3表示它正在处理中等），并且它们应该逃避你得到的反应，所以你不要插入可能不安全的javascript或其他内容。

更强大的框架将为您提供的另一件事是，除了使用innerHTML替换DOM中的项目之外，还能做更多的事情。此处的函数只能用于将一个元素替换为ajax调用的响应。你可以用Ajax做更多的事情。

Answer 2

我会删除这一行。

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

用他可能不理解的语言对用户大喊大叫比失败更糟糕。： - ）

Answer 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.
}

我认为那会奏效。但正如前面提到的 - 为什么重新发明轮子，使用图书馆。更好 - 找出他们是如何做到的。

Answer 4

jQuery可能是最轻的流行图书馆之一。

Answer 5

原型中同样的事情：

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

Ajax.Updater in Prototype API

Answer 6

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

Ajax需要的不仅仅是这个功能

6 个答案: