下载此文档

跟我学ajax技术——如何应用ajax技术实现级联菜单的web应用示例.doc


文档分类:IT计算机 | 页数:约12页 举报非法文档有奖
1/12
下载提示
  • 1.该资料是网友上传的,本站提供全文预览,预览什么样,下载就什么样。
  • 2.下载该文档所得收入归上传者、原创者。
  • 3.下载的文档,不会出现我们的网址水印。
1/12 下载此文档
文档列表 文档介绍
跟我学AJAX技术——如何应用AJAX技术实现级联菜单的Web应用示例
常规的Web级联菜单所存在的问题
以前,为了避免每次对菜单的操作引起的重载页面,不采用每次调用后台的方式,而是一次性地将级联菜单的所有数据全部读取出来并写入到数组中,然后根据用户的操作用JavaScript+CSS来控制它的子集项目的显示,这样虽然解决了操作响应的速度、不重载页面以及避免向服务器频繁发送请求的问题,但是如果用户不对菜单进行操作或者只对菜单中的一部分进行操作的话,那读取的数据中的一部分就会成为多余而浪费用户的资源,特别是在菜单的结构复杂、数据量大的情况下,这样的弊端就更为突出!
而如果采用AJAX技术来实现(JavaScript+CSS+AJAX),在页面初始化的时候,我们只需要读出其一级菜单的数据并显示出。而在用户操作时,则通过AJAX向后台请求其下一级的菜单数据并显示出------这样,需要什么就下载什么!
构建本示例的Web应用项目
1、添加一个JSP页面
(1)
(2)在该页面中添加一个表格,并且在其中放上超链接
<%@ page language="java" pageEncoding="GB18030"%>
<%@ taglib uri="http://struts./tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts./tags-html" prefix="html" %>
<%@ taglib uri="http://struts./tags-logic" prefix="logic" %>
<%@ taglib uri="http://struts./tags-tiles" prefix="tiles" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Transitional//EN">
<html:html lang="true">
<head>
<html:base />
<script language="javascript" src="">
</script>
<title></title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="">
-->
</head>

<body>
<table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="20">
<a href="#" onclick="showSubMenu('menu_1')" >菜单一
</a>
</td>
</tr>
<tr>
<td height="20" id="menu_1" style="display:none">&nbsp;
</td>
</tr>
<tr>
<td height="20">
<a href="#" onclick="showSubMenu('menu_2')">菜单二
</a>
</td>
<tr >
<td height="20" id="menu_2" style="display:none">&nbsp;
</td>
</tr>
</table>
</body>
</html:html>
(3)
2、
(1)
(2)
var httpRequest;
var currentPos;
function showSubMenu(

跟我学ajax技术——如何应用ajax技术实现级联菜单的web应用示例 来自淘豆网www.taodocs.com转载请标明出处.

相关文档 更多>>
非法内容举报中心
文档信息
  • 页数12
  • 收藏数0 收藏
  • 顶次数0
  • 上传人marry201208
  • 文件大小216 KB
  • 时间2018-06-25