Ajax二级动态菜单

原创 2006年06月22日 11:39:00

//Multi_menu.htm

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>MULTI-MENU</title>
<script type="text/javascript">
var currentPos="";
var http_request=false;
function send_request(method,url){
http_request=false;

// inital HttpRequest
if(window.XMLHttpRequest){//Mozilla
http_request = new XMLHttpRequest();
if(http_request.overrideMimeType){//set MIME
http_request.overrideMimeType("text/xml");
}//END SET MIME
}
else if(window.ActiveXObject){//IE Browser,Use Lasted version

var MSXML = ['MSXML2.XMLHTTP.5.0', 'MSXML2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP', 'Microsoft.XMLHTTP'];
for(var n = 0; n < MSXML.length; n ++)
{
try{
http_request = new ActiveXObject(MSXML[n]);
http_request.setRequestHeader("Content-Type","text/xml");
http_request.setRequestHeader('Content-Type', 'text/html; charset=gb2312'); //Last version need set, and it lik iFrame
if (method.toUpperCase( )=="POST" ){//post method
http_request.setRequestHeader('Connection', 'close');
http_request.setRequestHeader('Content-type','application/x-www-form-urlencoded');
}
break;
}
catch(e){http_request  = false;}
}//End IE
}// End inital HttpRequest

if(!http_request){//Error, Creat object fail
 window.alert("Cannot create an XMLHTTP instance")
 return false;
}
http_request.onreadystatechange = processRequest;
//get post or head, and asychFlag??
http_request.open(method, url,true);
http_request.send(null);
}// End send_request()

function processRequest(){
if(http_request.readyState == 4){
if(http_request.status == 200){
document.getElementById(currentPos).innerHTML= http_request.responseText;
}
else{
alert("Your Reqeust Page Error")}
}
}// End processRequest()

function showRole(obj){
if(document.getElementById(obj).parentNode.style.display=="none"){
document.getElementById(obj).parentNode.style.display="";
document.getElementById(obj).innerHTML ="loading...";
currentPos =obj;
//alert("ok");
send_request("post","mm.asp?playPos="+obj);
}
else{
document.getElementById(obj).parentNode.style.display="none";
}
}//End showRole

</script>

</head>
<body>
<table width="75%" border="1">
  <tr>
    <td><a href="javascript: void(0)" onClick="showRole('pos_1')" >经理室</a></td>
  </tr>
  <tr style="display:none">
    <td id="pos_1">&nbsp;</td>
  </tr>
  <tr>
    <td><a href="javascript: void(0)" onClick="showRole('pos_2')">开发部</a></td>
  </tr>
  <tr style="display:none">
    <td id="pos_2">&nbsp;</td>
  </tr>
</table>
</body>
</html>

//mm.asp

<% response.Charset="GB2312" '实现中文输出的关键%>
<%
playPos = request("playPos")
if playPos="pos_1" then 
response.Write("总经理<br>副经理") ''可以用数据库技术进行相关处理
elseif playPos="pos_2" then
response.Write("总工程师<br>软工程师")
end if
%>//

ajax实现点击左侧菜单,右侧加载不同网页

使用aiax实现左侧菜单改变右侧内容
  • DecadentF
  • DecadentF
  • 2017年09月14日 16:53
  • 1262

jQuery实例(ajax通信和动态加载二级菜单)

今天是复习jQuery的最后一天,基本常用技术已全部练习,以后遇到不会的可查文档。总的来说,jQuery的出现,在写前端代码时省事了好多。 one.jsp "> ...
  • zuosixiaonengshou
  • zuosixiaonengshou
  • 2017年03月18日 20:57
  • 930

使用Jquery的局部刷新功能,实现菜单内容的动态切换

在以前的开发中,我们很喜欢使用iframe实现菜单内容的动态切换。但是iframe的可操作性、搜索上、与整体页面的配合上,存在着诸多问题。 现在我们可以使用成熟的jquery ajax技术实现菜单的...
  • simon_xu_sh
  • simon_xu_sh
  • 2016年10月27日 15:38
  • 4175

ajax动态加载下拉框、单选框、复选框

//select下拉菜单动态加载 方式一: $.ajax({ type:"get", dataType:"json", contentType:"application/json;charse...
  • yyyyu3
  • yyyyu3
  • 2012年11月08日 13:31
  • 3857

分别用四种Ajax工具实现下拉菜单动态刷新的DEMO

  • 2009年04月20日 13:08
  • 740KB
  • 下载

Ajax动态为下拉列表添加数据

1. 前台jsp,新建一个下拉控件 2. js部分,建一个function方法,利用ajax,指向 'getAllTypes.action' 的servlet部分,获取传来的下拉列表...
  • ChauncyWu
  • ChauncyWu
  • 2017年01月22日 20:49
  • 1815

ajax动态树型菜单(jsp)

  • 2009年09月08日 15:48
  • 242KB
  • 下载

jQuery实例(ajax通信和动态加载二级菜单)

今天是复习jQuery的最后一天,基本常用技术已全部练习,以后遇到不会的可查文档。总的来说,jQuery的出现,在写前端代码时省事了好多。 one.jsp "> ...
  • zuosixiaonengshou
  • zuosixiaonengshou
  • 2017年03月18日 20:57
  • 930

Ajax实现二级联动菜单

index.jsp 二级菜单联动演示 var req; window.onload=function() {//页面加载时的函...
  • u013096666
  • u013096666
  • 2016年04月18日 11:27
  • 1430

二级联动菜单,简单实现

/** * jQuery Linkage Menu * * Copyright 2014, sunyingyuan * QQ: 1586383022 * Email: yingyuansun...
  • sunyingyuan
  • sunyingyuan
  • 2014年03月04日 10:16
  • 3621
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Ajax二级动态菜单
举报原因:
原因补充:

(最多只允许输入30个字)