`
bruce198
  • 浏览: 232493 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

Ajax应用场景

    博客分类:
  • java
阅读更多

      适用场景
  表单驱动的交互
  传统的表单提交,在文本框输入内容后,点击按钮,后台处理完毕后,页面刷新,再回头检查是否刷新结果正确。使用Ajax,在点击 sunmit按钮后,立刻进行异步处理,并在页面上快速显示了更新后的结果,这里没有整个页面刷新的问题。

  深层次的树的导航

  深层次的级联菜单(树)的遍历是一项非常复杂的任务,使用JavaScript来控制显示逻辑,使用Ajax延迟加载更深层次的数据可以有效 的减轻服务器的负担。

  我们以前的对级联菜单的处理多数是这样的:

  为了避免每次对菜单的操作引起的重载页面,不采用每次调用后台的方式,而是一次性将级联菜单的所有数据全部读取出来并写入数组, 然后根据用户的操作用 JavaScript来控制它的子集项目的呈现,这样虽然解决了操作响应速度、不重载页面以及避免向服务器频繁发送请求的 问题,但是如果用户不对菜单进行 操作或只对菜单中的一部分进行操作的话,那读取的数据中的一部分就会成为冗余数据而浪费用户的资源, 特别是在菜单结构复杂、数据量大的情况下(比如菜单有 很多级、每一级菜又有上百个项目),这种弊端就更为突出。

  如果在此案中应用Ajax后,结果就会有所改观:

  在初始化页面时我们只读出它的第一级的所有数据并显示,在用户操作一级菜单其中一项时,会通过Ajax向后台请求当前一级项目所属的 二级子菜单的所有数据,如 果再继续请求已经呈现的二级菜单中的一项时,再向后面请求所操作二级菜单项对应的所有三级菜单的所有数据, 以此类推……这样,用什么就取什么、用多少就取 多少,就不会有数据的冗余和浪费,减少了数据下载总量,而且更新页面时不用重载全部内 容,只更新需要更新的那部分即可,相对于后台处理并重载的方式缩短了 用户等待时间,也把对资源的浪费降到最低。

  快速的用户与用户间的交流响应

  在众多人参与的交流讨论的场景下,最不爽的事情就是让用户一遍又一遍刷新页面以便知道是否有新的讨论出现。新的回复应该以最快 的速度显示出来,而把用户从分神的刷新中解脱出来,Ajax是最好的选择。

  类似投票、yes/no等无关痛痒的场景

  对于类似这样的场景中,如果提交过程需要达到40秒,很多的用户就会直接忽略过去而不会参与,但是Ajax可以把时间控制在1秒之内 ,从而更多的用户会加入进来。

  对数据进行过滤和操纵相关数据的场景

  对数据使用过滤器,按照时间排序,或者按照时间和名称排序,开关过滤器等等。任何要求具备很高交互性数据操纵的场合都应该用 JavaScript,而不是用一系列的服务器请求来完成。在每次数据更新后,再对其进行查找和处理需要耗费较多的时间,而Ajax可以加速这个过 程。

  普通的文本输入提示和自动完成的场景

  在文本框等输入表单中给予输入提示,或者自动完成,可以有效的改善用户体验,尤其是那些自动完成的数据可能来自于服务器端的场合, Ajax是很好的选择。

  不适用场景

  部分简单的表单

  虽然表单提交可以从Ajax获取最大的益处,但一个简单的评论表单极少能从Ajax得到什么明显的改善。而一些较少用到的表单提交,Ajax则 帮不上什么忙。

  搜索

  有些使用了Ajax的搜索引擎如Start.com和Live.com不允许使用浏览器的后退按钮来查看前一次搜索的结果,这对已经养成搜索习惯的用户 来说是不可原谅的。现在Dojo通过iframe来解决这个问题。

  基本的导航

  使用Ajax来做站点内的导航是一个坏主意,为什么不把时间放在让系统程序作的更好上呢?

  替换大量的文本

  使用Ajax可以实现页面的局部刷新,但是如果页面的每个部分都改变了,为什么不重新做一次服务器请求呢?

  对呈现的操纵

  Ajax看起来像是一个纯粹的UI技术,但事实上它不是。它实际上是一个数据同步、操纵和传输的技术。对于可维护的干净的web应用,不使 用Ajax来控制页面呈现是一个不错的主意。JavaScript可以很简单的处理XHMTL/HTML/DOM,使用CSS规则就可以很好的表达数据显示。

  存在的问题

  用JavaScript作的Ajax引擎,JavaScript的兼 容性和DeBug都是让人头痛的事;

  Ajax的无刷新重载,由于页面的变化没有刷新重载那么明显,所以容易给用户带 来困扰?D?D用户不太清楚现在的数据是新的还是已经更新过的;现有的解决有:在相关位置提示、数据更新的区域设计得比较明显、数据更新 后给用户提示等;

  中间过程不能被bookmark。解决方法: GoogleMaps通过在页面上提供一个”link to this page”的办法来解决。另外,还可以通过url链接中加无效的?^标记来解决,但还未验证。

分享到:
评论

相关推荐

    Ajax应用场景.txt

    Ajax不是万能的,在适合的场合使用Ajax,才能充分发挥它的长处,改善系统性能和用户体验,绝不可以为了技术而滥用。

    AJAX使用场景分析

    1.表单驱动的交互  传统的表单提交,在文本框输入内容后,点击按钮,后台处理完毕后,页面刷新...使用Ajax,在点击submit按钮后,立刻进行异步处理,并在页面上快速显示了更新后的结果,这里没有整个页面刷新的问题。

    很典型的ajax应用

    如题: 一个 输入关键字动态显示列表的简单实例 ajax实例 ajax应用 根据关键字搜寻列表 ajax应用到Java

    基于AJAX 和X3D 的虚拟场景交互架构研究

    于服务器端的特定三维物体,结合AJAX技术,提出一个AJAX和X3D结合的场景交互架构,通过一个应用实 例给出了AJAX和X3D结合的场景交互实现方法.该场景交互架构很好地解决了三维场景与服务器端的通信 问题.

    ajax异步请求小结

    具体描述ajax的获取,ajax属性,参数设置,编程步骤,缓存问题,get/post乱码问题,以及应用场景的阐述 onreadystatechange 绑订事件处理函数(处理readystatechange事件)。 注:当readyState属性值发生了任何的改变...

    Ajax经典案例开发大全

    本书是“网站开发非常之旅”丛书之一,该书用40多个实例覆盖Ajax技术应用的典型场景,用完整的流程图表示函数的调用关系,并指明了实例可扩展或可改进的地方。书中的实例相对独立,可从任何一个开始阅读;该书还讲解...

    JavaScript学习总结之JS、AJAX应用

     AJAX(音译为:阿贾克斯) = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术,也就是在无需重新加载整个网页的情况下,能够更新部分网页的技术。AJAX ...

    Ajax+PHP程序设计实战详解

    Ajax+PHP程序设计实战详解》介绍Ajax和PHP两种比较流行的技术,覆盖了Ajax和PHP技术的基本知识和应用场景。《Ajax+PHP程序设计实战详解》分为5篇,分别为:PHP基础篇、PHP Web应用篇、Ajax基础开发篇、组合篇和实例...

    ASP.NET Ajax框架教程

    应用场景代码示例(1)ScriptManager控件示例(2)UpdatePanel控件示例(3)UpdateProgress控件示例(4) Timer控件示例(5) Ajax中新Validators控件用法示例。。。。。。等,教程是基础是郑健老师的。。。内附有...

    Asp.net+Ajax框架教程 文档+源码

    应用场景代码示例... 1).ScriptManager控件示例... 1. 在异步调用服务端注册客户端脚本新方法... 2. 捕获Ajax异步调用中错误(默认使用alert提示). 3. 捕获Ajax异步调用中错误(自定义输出错误方式) 2)....

    异步的使用场景

    Ajax异步的使用场景: (1) 比如:登陆成功后的页面加载:加载分页新闻, 原始web同步:登录控制层成功后跳转加载新闻的控制层 先加载完毕所有的页面上的数据,然后再跳转主页面并展示。 Ajax异步:登陆成功后跳转...

    jQuery实现AJAX定时刷新局部页面实例

    本篇文章通过两种方法实例讲解ajax定时刷新局部页面,当然方法有很多种,也可以不使用ajax来刷新页面,可以使用jquery中的append来给指定内容加东西,但是都不太实用,最实用的方法还是ajax加载数据了。

    ASP.NET和AJAX简洁教程

    范例场景 范例开发了一个Web页面,用于输入Northwind数据库职员表中的职员数据。页面通过ASP.NET AJAX功能,调用一个Web Service来完成职员表中的数据增、删、改、查。 创建一个Web Service 作为开始,使用Visual ...

    Ajax in Action

    介绍Ajax的原理以及经典应用场景,是学习与熟练掌握Ajax的一本好书

    多ajax请求的各类解决方案(同步, 队列, cancel请求)

    第2种case 应用场景: 多个ajax请求,需要顺序执行,后一个ajax请求的执行参数是前一个ajax的结果。例如: 用户登录后我们发送一次请求得到用户的应用ID,然后利用应用ID发送一次请求得到具体的应用内容(例子虽然...

    基于jQuery的动态虚拟场景技术研究

    在分析Ajax技术在X3D虚拟现实系统开发中使用现状及存在问题的基础上,提出将jQuery库引入到X3D虚拟系统开发过程中。该方法通过与SAI(scene access interface)的结合,实现了虚拟场景的动态加载和更新,有效提高了系统的...

    jquery ajax中使用jsonp的限制解决方法

    jsonp 解决的是跨域 ajax 调用...今天,发现 jsonp 的另外一个限制(在jquery ajax的场景下) —— 不会触发 $.ajax 的error callback,示例代码如下: 代码如下:$.ajax({ dataType: ‘jsonp’, error: function (xh

    JavaScript模板引擎应用场景及实现原理详解

    本文实例讲述了JavaScript模板引擎应用场景及实现原理。分享给大家供大家参考,具体如下: 一、应用场景 以下应用场景可以使用模板引擎: 1、如果你有动态ajax请求数据并需要封装成视图展现给用户,想要提高自己的...

    ajax完整代码与实现.rar_ajax_java_servlet_实现_源码

    提供了实现ajax 异步Javascript和XML的实现方法,对常见应用场景,提供了详尽的代码描述,对熟悉掌握web编程非常有好处!!!希望对大家有帮助!!

    基本于J2EE的Ajax宝典.rar

    作为一个有多年编程经验的程序员,笔者相信“代码就是硬道理”,因此本书中涵盖了 Ajax 的绝大部分实际应用场景。希望读者也不要仅仅“看书”,而一定要参照本书进行动手操作,将每个应用都实际做一遍,相信会有很大...

Global site tag (gtag.js) - Google Analytics