`

Ajax 及其入门基础(二)

    博客分类:
  • java
阅读更多
注意Ajax本身是一种浏览器端技术,它和Web服务器端采用什么脚本书写代码是没有关系的。比如我们把Client.htm的语句send_request(‘server.php’, username)换为send_request(‘server.asp’, username),再相对应的建立server.asp文件,内容为:
<%
    dim username
    username = request(”username”)

    if username=”Thomas” then
     response.write(”用户名” & username & “已经被注册,请更换一个用户名”)
    else
     response.write(”用户名” & username & “尚未被使用,您可以继续”)
    end if
    %>



    做了这样的改变后,在浏览器端,用户看到的效果是一模一样的。

    四、常见Ajax编程框架

    既然上述Ajax框架已经能工作了,为什么还有那么多的框架呢?

    随着页面的复杂,可能需要书写大量的Javascript脚本来对页面中的DOM对象进行控制,工作量和复杂度会大大增加。Ajax编程框架通常利用面向对象的方法,对一些基本的对象和行为及其复杂性进行了合理的封装,建造了一套有自己特色的类库,并且考虑了效率和可扩充性等优点。我们在开发时,可以使用较少的、更清晰的代码,完成自己的工作。也使程序员有更多的时间和精力考虑业务逻辑本身,而不是与一堆脚本纠缠在一起。

    框架都是与后台脚本相关的。通过后台脚本编程,我们可以不必书写大量的Javascript脚本就能构建浏览器兼容的Ajax应用。比如,我使用一个比较流行的PHP xAjax框架,对前边的示例程序进行了改写:  <?php
      require_once ("../xajax/xajax.inc.php");

      //服务器处理函数
      function processForm($aFormValues)
      {
       $objResponse = new xajaxResponse();
       $bError = false;

       //清空错误信息
       $objResponse->addClear("usernameInfo", "innerHTML");

       //判断账号
       if (trim($aFormValues['username']) == "")
       {
        $objResponse->addAppend("usernameInfo", "innerHTML", "Please Input user name.");
        $bError = true;
       }
       else
       {
          if(trim($aFormValues['username'])=="Thomas")
           $objResponse->addAppend("usernameInfo", "innerHTML", "Has been registed");
          else
           $objResponse->addAppend("usernameInfo", "innerHTML", "Has not been registed");
        $bError = false;
       }

       if (!$bError)
       {
        $sForm .="<div>账号:" .$aFormValues['username']. "</div>\n";
       }
       else
       {
        $objResponse->addAssign("submitButton", "value", "Submit");
        $objResponse->addAssign("submitButton", "disabled", false);
       }

       return $objResponse;
      }

      //构造对象
      $xajax = new xajax();

      //注册处理函数
      $xajax->registerFunction("processForm");

      //接管HTTP请求
      $xajax->processRequests();
    ?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
      <?php
       //生成必要的JavaScript
       $xajax->printJavascript('../xajax/');
      ?>

      <title>XAJAX 用户注册</title>
      <style type="text/css">
        #formWrapper{ color: #111111; background-color: rgb(200,200,200); width: 360px;}
        #title{color: #FFFFFF; text-align: center; background-color: #000000; }
        #formDiv{ padding: 20px;}
        .submitDiv{ margin-top: 10px; text-align: center; }
        .errorSpan{ color:red;}
      </style>

      <script type="text/javascript">
      <!--//提交表单
        function submitSignup()
        {
         xajax.$('submitButton').disabled=true;
         xajax.$('submitButton').value="验证中...";
         xajax_processForm(xajax.getFormValues("signupForm"));
         return false;
        }
      //-->
      </script>

    </head>

    <body>

      <form id="signupForm" action="javascript:void(null);" onsubmit="submitSignup();">
      用户名:<input type="text" name="username" value="">&nbsp;
      <input type="button" name="check" value="Check Only one" onClick="submitSignup();">
      <input type="submit" id="submitButton" name="submit" value="Submit">
      </form>

      <div id="usernameInfo" class="errorSpan">&nbsp;</div>

    </body>
    </html>



    大家看到了这段代码前边的包含语句了吧:require_once ("……/xajax/xajax.inc.php")。xajax.inc.php就是定义xajax等相关类库的文件,这个文件里还包含了大量的javascript脚本文件和其他的常数定义等。Xajax类有一条自己的属性和方法,接管和封装了原始的Ajax的行为和方法,用于处理用户的事件和页面文档对象的属性和外观。

    Ajax框架有它自己的好处,但是,目前由于Ajax框架太多,各有各的优点和缺点,特别是对PHP语言,我们很难在众多的框架中选中一个最适合我们自己的项目的框架。框架太多加大了交流的成本。框架本身在降低了代码复杂度的同时,也带来了学习的成本。不像。NET,背靠财大气粗的公司,就一套程序库,一套通用的IDE,熟练一门语言(比如C#),就可以开发Web和桌面应用。

    最后还要注意一下,Ajax并不是万金油,任何项目都想用一下。Ajax目前大多数应用在数据校验等应用上,在项目中用的时候请慎重考虑。

分享到:
评论

相关推荐

    爬虫系列课+Python技术+爬虫与反爬+基础入门课

    1. **Python爬虫入门基础** - 1.1 爬虫概念及其工作原理 - 1.2 Python环境搭建与爬虫库介绍 - 1.3 爬虫的合法性与道德规范 2. **网络请求与HTML基础** - 2.1 HTTP协议基础 - 2.2 使用requests库发起网络请求 -...

    XML入门经典(第4版).part1.rar

    主要内容有XML基本语法、DTD、XML Schema、RELAX NG、XPath、XSLT、XQuery、DOM、SAX、RSS、Web服务、Ajax、SOAP、CSS、XHTML、SVG和XForms等,每章都有习题,书后附有参考答案,可帮助你全面掌握XML及其应用方法。

    PHP7从入门到精通.zip

    分别介绍了PHP 7的基本概念、PHP服务器环境配置、PHP的基本语法、PHP的语言结构、字符串和正则表达式、数组、时间和日期、面向对象编程...基础、PHP与XML技术、PHP与Ajax的综合应用、Smarty模板、Zend framework框架等...

    爬虫技术系列课+Python+爬虫基础知识爬虫实例反爬机制+自学课程

    Python爬虫入门基础 1.1 爬虫概念及其工作原理 1.2 Python环境搭建与爬虫库介绍 1.3 爬虫的合法性与道德规范 网络请求与HTML基础 2.1 HTTP协议基础 2.2 使用requests库发起网络请求 2.3 HTML结构解析与XPath/CSS选择...

    XML入门经典(第4版).part3.rar

    主要内容有XML基本语法、DTD、XML Schema、RELAX NG、XPath、XSLT、XQuery、DOM、SAX、RSS、Web服务、Ajax、SOAP、CSS、XHTML、SVG和XForms等,每章都有习题,书后附有参考答案,可帮助你全面掌握XML及其应用方法。

    XML入门经典(第4版).part2.rar

    主要内容有XML基本语法、DTD、XML Schema、RELAX NG、XPath、XSLT、XQuery、DOM、SAX、RSS、Web服务、Ajax、SOAP、CSS、XHTML、SVG和XForms等,每章都有习题,书后附有参考答案,可帮助你全面掌握XML及其应用方法。

    XML入门经典(第4版).part4.rar

    主要内容有XML基本语法、DTD、XML Schema、RELAX NG、XPath、XSLT、XQuery、DOM、SAX、RSS、Web服务、Ajax、SOAP、CSS、XHTML、SVG和XForms等,每章都有习题,书后附有参考答案,可帮助你全面掌握XML及其应用方法。

    Extjs4.1.1

    Extjs基础入门系列: 第一讲.ExtJs初识及其环境搭建 第二讲.开始ExtJs梦想之旅 第三讲.ExtJS工具栏、菜单栏 第四讲.ExtJS最常用的表单之textfield控件 第五讲.ExtJs最常用表单组件Number、CheckBox、Radio 第...

    Android程序设计基础

    第二部分 Android基础知识 23 第3章 设计用户界面 25 3.1 数独游戏简介 25 3.2 声明性设计 26 3.3 创建启动界面 27 3.4 使用替代资源 34 3.5 实现About对话框 37 3.6 应用主题 41 3.7 添加菜单 43 3.8 添加...

    《Java-Web应用开发基础》教学课件08课程设计实例.pptx

    而且,整个设计过程贯穿了MVC设计思路,是系统学习Java Web项目的入门案例之一。 《Java-Web应用开发基础》教学课件08课程设计实例全文共73页,当前为第6页。 8.3设 计 思 路 用户登录模块设计可划分为前台登录界面...

    Java Web编程宝典-十年典藏版.pdf.part2(共2个)

    第2篇为范例演练篇,主要包括基础知识相关、数据库相关、图像与文件相关、图表与报表相关、Ajax等相关的范例;第3篇为项目实战篇,主要包括讯友联系人管理模块、播客视频管理模块、博客管理模块、明日知道论坛管理...

    asp.net知识库

    技术基础 New Folder 多样式星期名字转换 [Design, C#] .NET关于string转换的一个小Bug Regular Expressions 完整的在.net后台执行javascript脚本集合 ASP.NET 中的正则表达式 常用的匹配正则表达式和实例 经典正则...

    精通JS脚本之ExtJS框架.part2.rar

    2.1.2 表单及其元素对象 2.1.3 浏览器信息对象 2.1.4 窗口对象 2.1.5 网址对象 2.1.6 历史记录对象 2.2 基本事件处理 2.3 2级DOM事件模型 2.3.1 事件传播 2.3.2 注册事件处理程序 2.3.3 event对象 2.4 ...

    精通JS脚本之ExtJS框架.part1.rar

    2.1.2 表单及其元素对象 2.1.3 浏览器信息对象 2.1.4 窗口对象 2.1.5 网址对象 2.1.6 历史记录对象 2.2 基本事件处理 2.3 2级DOM事件模型 2.3.1 事件传播 2.3.2 注册事件处理程序 2.3.3 event对象 2.4 ...

    ASP.NET MVC 3高级编程

    第1章 入门 1 1.1 asp.net mvc简介 1 1.1.1 asp.net mvc如何适应asp.net 1 1.1.2 mvc模式简介 2 1.1.3 mvc在web框架中的应用 2 1.1.4 asp.net mvc 3的发展历程 3 1.1.5 razor视图引擎 5 1.1.6 验证的改善 8 ...

    Ext Js权威指南(.zip.001

    第1章 ext js 4开发入门 / 1 1.1 学习ext js必需的基础知识 / 1 1.2 json概述 / 3 1.2.1 认识json / 3 1.2.2 json的结构 / 3 1.2.3 json的例子 / 4 1.2.4 在javascript中使用json / 4 1.2.5 在.net中使用...

    ASP.NET4高级程序设计第4版 带目录PDF 分卷压缩包 part1

    ASP.NET 4高级程序设计(第4版)》【原版书为:Pro ASP.NET 4 in C# 2010】是ASP.NET领域的鸿篇巨制,全面讲解了ASP.NET4的各种特性及其背后的工作原理,并给出了许多针对如何构建复杂、可扩展的网站从实践中得出的...

    ASP.NET4高级程序设计(第4版) 3/3

     《ASP.NET 4高级程序设计(第4版)》是ASP.NET领域的鸿篇巨制,全面讲解了ASP.NET4的各种特性及其背后的工作原理,并给出了许多针对如何构建复杂、可扩展的网站从实践中得出的建议。书中还深入讲述了其他ASP.NET图书...

Global site tag (gtag.js) - Google Analytics