LG10V1.0.ppt

第十章上机,使用Ajax改进用户体验,相关回顾,Ajax的含义是？Ajax可以用来实现什么效果？Ajax的核心组件是？使用Ajax的步骤是？,上机目标,继续增强“我的宝贝儿”在线宠物网站：在宠物信息编辑页面，在不刷新页面的情况下检查宠物名是否已经被占用。在宠物训练页面，在不刷新页面的情况下完成训练功能，并更新分数的显示。,教员讲解上机目标,训练技能点,使用XMLHttpRequest实现无刷新请求服务器。DWR的使用。,训练要点：使用XMLHttpRequest实现无刷新请求服务器 需求说明：在无刷新的情况下实现宠物训练功能：1、使用XMLHttpRequest提交请求到服务器2、获得训练结果(宠物的三项分数)3、刷新显示,阶段1,讲解需求说明,实现思路及关键代码：修改原PetAction中doGame、doStory和doFeed代码。使之返回宠物得分字符串。修改petInfo.jsp页的doTraining函数。,阶段1,代码示例,讲解实现思路和关键代码,完成时间：20分钟,需求说明：在宠物信息编辑页面，当输入新的宠物名后，宠物名输入框失去焦点时检查宠物名是否已经被占用，如果已经被占用则显示提示信息。1、创建PetManager，提供检查宠物名是否存在的方法。2、在PetAction中创建doCheckNameExists方法。3、如果宠物名没有修改则不检查。,阶段2,完成时间：15分钟,阶段2,常见调试问题及解决办法代码规范问题,共性问题集中讲解,训练要点：DWR的使用 需求说明：同阶段1使用DWR实现只实现“喂食”功能,阶段3,讲解需求说明,实现思路及关键代码：在PetManger中添加doFeed(Long id)方法，返回需要更新到页面的字符串添加DWR到项目中。(添加dwr.jar、dwr.xml，修改web.xml)修改petInfo.jsp页面，将喂食功能使用DWR实现,阶段3,讲解实现思路和关键代码,完成时间：15分钟,需求说明：使用DWR检查宠物名是否已经被占用 同阶段3使用DWR实现,阶段4,完成时间：15分钟,阶段4,常见调试问题及解决办法代码规范问题,共性问题集中讲解,总结,总结并布置作业,Thank you,