PHP开发笔记's Archiver

fangzhen 发表于 2009-10-30 09:35

prototype使用 Ajax.Updater 类

<P>如果你的服务器的另一端返回的信息已经是HTML了,那么使用这个程序包中 <TT class=literal><FONT face=新宋体>Ajax.Updater</FONT></TT> 类将使你的生活变得更加得容易。用它你只需提供哪一个元素需要被AJAX请求返回的HTML填充就可以了,例子比我写说明的更清楚。</P>
<P></P><PRE class=programlisting>&lt;script&gt;
    function getHTML()
    {
        var url = 'http://yourserver/app/getSomeHTML';
        var pars = 'someParameter=ABC';

         <SPAN class=bold><STRONG>var myAjax = new Ajax.Updater('placeholder', url, {method: 'get', parameters: pars});</STRONG></SPAN>

    }
&lt;/script&gt;

&lt;input type=button value=GetHtml onclick="getHTML()"&gt;
&lt;div id="placeholder"&gt;&lt;/div&gt;</PRE>
<P></P>
<P>你可以看到,这段代码比前面的例子更加简洁,不包括 <TT class=literal><FONT face=新宋体>onComplete</FONT></TT> 方法,但是在构造方法中传入了一个元素id。 我们来稍稍修改一下代码来描述如何在客户端处理服务器段错误成为可能。</P>
<P>我们将加入更多的选项, 指定处理错误的一个方法。这个是用 <TT class=literal><FONT face=新宋体>onFailure</FONT></TT> 选项来完成的。</P>
<P>我们也指定了一个 <TT class=literal><FONT face=新宋体>placeholder</FONT></TT> 只有在成功请求之后才会被填充。为了完成这个目的我们修改了第一个参数从一个简单的元素id到一个带有两个属性的对象, <TT class=literal><FONT face=新宋体>success</FONT></TT> (一切OK的时候被用到) 和 <TT class=literal><FONT face=新宋体>failure</FONT></TT> (有地方出问题的时候被用到) 在下面的例子中没有用到<TT class=literal><FONT face=新宋体>failure</FONT></TT>属性,而仅仅在 <TT class=literal><FONT face=新宋体>onFailure</FONT></TT> 处使用了 <TT class=literal><FONT face=新宋体>reportError</FONT></TT> 方法。</P><PRE class=programlisting>&lt;script&gt;
    function getHTML()
    {
        var url = 'http://yourserver/app/getSomeHTML';
        var pars = 'someParameter=ABC';<SPAN class=bold><STRONG>
        var myAjax = new Ajax.Updater(
                    {success: 'placeholder'},
                    url,
                    {method: 'get', parameters: pars, onFailure: reportError});</STRONG></SPAN>

    }

    function reportError(request)
    {
        alert('Sorry. There was an error.');
    }
&lt;/script&gt;

&lt;input type=button value=GetHtml onclick="getHTML()"&gt;
&lt;div id="placeholder"&gt;&lt;/div&gt;</PRE>
<P>如果你的服务器逻辑是返回JavaScript 代码而不是单纯的 HTML 标记, <TT class=literal><FONT face=新宋体>Ajax.Updater</FONT></TT>对象可以执行那段JavaScript代码。为了使这个对象对待响应为JavaScript,你只需在最后参数的对象构造方法中简单加入<TT class=literal><FONT face=新宋体>evalScripts: true</FONT></TT>属性。</P>
<P></P>
<P></P>
<P>更完全的解释,请参照 <FONT color=#0000ff>Ajax.Updater 参考</FONT> 和 <FONT color=#0000ff>Ajax选项参考</FONT> 。</P>

页: [1]

Powered by Discuz! Archiver 6.1.0  © 2001-2007 Comsenz Inc.