var myAjax = new Ajax.Updater( {success: 'placeholder'}, url, { method: 'get', parameters: pars, onFailure: reportError });
} function reportError(request) { alert('Sorry. There was an error.'); } </script> <input type=button value=GetHtml> <div></div>如果你的服务器逻辑是连同HTML 标记返回JavaScript 代码, Ajax.Updater对象可以执行那段JavaScript代码。为了使这个对象对待响应为JavaScript,你只需在最后参数的对象构造方法中简单加入evalScripts: true属性。但是值得提醒的是,像这个选项名evalScripts暗示的,这些脚本会被执行,但是它们不会被加入到Page的脚本中。“有什么区别?”,可能你会这样问。我们假定请求地址返回的东东像这样:
<script language="javascript" type="text/javascript"> function sayHi(){ alert('Hi'); } </script> <input type=button value="Click Me">如果你以前这样尝试过,你知道这些脚本不会如你所期望的那样工作,原因是这段脚本会被执行,但像上面这样的脚本执行并不会创建一个名叫sayHi的函数,它什么也不做。如果要创建一个函数,我们应当把代码改成下面这个样子:
<script language="javascript" type="text/javascript">sayHi = function(){ alert('Hi'); };
</script> <input type=button value="Click Me">为什么我们在上面的代码中不使用var关键字来声明这个变量呢(指sayHi ),因为那样做创建出来的函数将只是当前脚本块的一个局部变量(至少在IE中是这样)。不写var关键字,创建出来的对象的作用域就是我们所期望的window。
更多相关知识,请参看 和.
枚举... 噢!噢!你知道,我们都是这样来做循环的,建一个Array,用elements组织它们,再建一个循环结构(例如for,foreach,while)通过index数字来访问每一个element,再用这个element做一些动作。
当你想到这时,你会发现几乎每次写循环代码你都会迟早用到一个Array。那么,如果Array对象能够提供更多的功能给它们的迭代器使用不是很爽吗?确实是这样,事实上很多的编程语言都在它们的Array或其它类似的结构中(如Collections,Lists)提供一些这样的功能。
现在好了,prototype.js了给我们一个 对象,它实现了很多和可迭代数据进行交互的窍门。和原有的JS对象相比prototype.js更上一层楼,它对扩展了所有枚举要用的函数。
循环, Ruby样式的在标准的javascript中,如果你想把一个array中的所有elements显示出来,你可以像下面代码这样写得很好:
<script> function showList(){ var simpsons = ['Homer', 'Marge', 'Lisa', 'Bart', 'Meg'];for(i=0;i<simpsons.length;i++){ alert(simpsons[i]); }
} </script> <input type="button" value="Show List" >使用我们新的最好的朋友,prototype.js,我们可以把它生写成这样
function showList(){ var simpsons = ['Homer', 'Marge', 'Lisa', 'Bart', 'Meg'];simpsons.each( function(familyMember){ alert(familyMember); });
}你可能会想“非常奇怪的方式...相对旧的,这种语法太怪异了”。哦,在上面的例子,确实什么也没有,在这个简单得要死例子中,也没有改变太多啊,尽管如此,请继续读下去。
在继续下面内容之前,你注意到那个被做为一个参数传递给each函数的函数?我们把它理解成迭代器函数。
Your arrays on steroids就如我们上面提到的,把你的Array中的elements当成相同的类型使用相同的属性和函数是很通用(Common,不知该翻译成通用还是庸俗)的。让我们看看怎么样利用我们新的马力强劲的Arrays的迭代功能吧。
依照标准找到一个element。
<script> function findEmployeeById(emp_id){ var listBox = $('lstEmployees') var options = listBox.getElementsByTagName('option'); options = $A(options); var opt = options.find( function(employee){ return (employee.value == emp_id); }); alert(opt.innerHTML); //displays the employee name } </script> <select size="10" > <option value="5">Buchanan, Steven</option> <option value="8">Callahan, Laura</option> <option value="1">Davolio, Nancy</option> </select> <input type="button" value="Find Laura" >
现在我们再下一城,看看如何过滤一个Array中的元素,从每个元素中得到我们想要的成员。