3.2 使用Ajax.Updater类

优质

小牛编辑

133浏览

2023-12-01

如果你的服务器的另一端返回的信息已经是HTML了，那么使用这个程序包中 Ajax.Updater类将使你的生活变得更加得容易。用它你只需提供哪一个元素需要被AJAX请求返回的HTML填充就可以了，例子比我写说明的更清楚。

<script>
function getHTML()
{
var url = 'http://yourserver/app/getSomeHTML';
var pars = 'someParameter=ABC';

var myAjax = new Ajax.Updater(
'placeholder',
url,
{
method: 'get',
parameters: pars
});

}
</script>
<input type=button value=GetHtml onclick="getHTML()">
<div id="placeholder"></div>

你可以看到，这段代码比前面的例子更加简洁，不包括 onComplete 方法，但是在构造方法中传入了一个元素id。我们来稍稍修改一下代码来描述如何在客户端处理服务器段错误成为可能。

我们将加入更多的选项，指定处理错误的一个方法。这个是用 onFailure 选项来完成的。我们也指定了一个 placeholder 只有在成功请求之后才会被填充。为了完成这个目的我们修改了第一个参数从一个简单的元素id到一个带有两个属性的对象， success (一切OK的时候被用到) 和 failure (有地方出问题的时候被用到) 在下面的例子中没有用到failure属性，而仅仅在 onFailure 处使用了 reportError 方法。

如果你的服务器逻辑是连同HTML 标记返回JavaScript 代码， Ajax.Updater对象可以执行那段JavaScript代码。为了使这个对象对待响应为JavaScript，你只需在最后参数的对象构造方法中简单加入evalScripts: true属性。但是值得提醒的是，像这个选项名evalScripts暗示的，这些脚本会被执行，但是它们不会被加入到Page的脚本中。“有什么区别？”，可能你会这样问。我们假定请求地址返回的东东像这样：

如果你以前这样尝试过，你知道这些脚本不会如你所期望的那样工作，原因是这段脚本会被执行，但像上面这样的脚本执行并不会创建一个名叫sayHi的函数，它什么也不做。如果要创建一个函数，我们应当把代码改成下面这个样子：

<script language="javascript" type="text/javascript">
sayHi = function(){
alert('Hi');
};
</script>
<input type=button value="Click Me" onclick="sayHi()">

为什么我们在上面的代码中不使用var关键字来声明这个变量呢（指sayHi ），因为那样做创建出来的函数将只是当前脚本块的一个局部变量（至少在IE中是这样）。不写var关键字，创建出来的对象的作用域就是我们所期望的window。

更多相关知识，请参看 Ajax.Updater reference和options reference.