WEB开发网
开发学院网页设计JavaScript Prototype实战教程----7.AJAX 阅读

Prototype实战教程----7.AJAX

 2010-09-14 13:10:25 来源:WEB开发网   
核心提示:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html>&l

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>Ajax</title>
    <script type="text/javascript" language="javascript"
     src="prototype.js" ></script>
    <script type="text/javascript" language="javascript">
    function test() {
      var myAjax = new Ajax.Request(
        'http://www.wanfangdata.com.cn',
        {
          method: 'get',
          onComplete: showResponse
        }
      );
    }
    
    function showResponse(response) {
      $('divResult').innerHTML = response.responseText;
    }    
    
    var handle = {
      onCreate: function() {
        Element.show('loading');
      },
      onComplete: function() {
        if (Ajax.activeRequestCount == 0) {
          Element.hide('loading');
        }
      }
    };
    Ajax.Responders.register(handle);//把handle注册到全局的Ajax.Responders,Ajax.Responders用来维护一个正在运行的Ajax对象列表
    </script>
  </head>
  <body>
  <input type="button" value="click" onclick="test()" />
  <div id="divResult" ></div>
  <div id='loading' style="display:none">
    <img src=http://tech.ddvip.com/2008-10/"loading2.gif">Loading
  </div>
  </body>
</html>

Tags:Prototype 实战 教程

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接