AJAX实现web页面中级联菜单的设计
作者:Easyjf 发布时间:2007-09-26 13:37:00
标签:级联,菜单,ajax
看了大峡搞的级联菜单,我也班门弄斧一把,嘿嘿,花了一点时间搞了个级联菜单贴上来看看。本例中只要你选择成员分类名称就会自动显示成员名称:
首先在eclipse中建一个项目,名称你自己做主了,这里为Easyjf-menu,对应的浏览器页面代码为:
<script language=”javascript”>
var XMLHttpReq;
var currentSort;
//创建xmlhttprequset对象
function createXMLHttpRequest(){
if(window.XMLHttpRequest){
XMLHttpReq=new XMLHttpRequest();
}
else if (window.ActiveXObject){
try{
XMlHttpReq=new ActiveXObject(“Msxml2.XMLHTTP”);
}catch(e){}
try{
XMLHttpRequest=new ActiveXObject(“Microsoft.XMLHTTP”);
}catch(e){}
}
}
//发送请求函数
function sendRequest(url){
createXMLHttpRequest();
XMLHttpReq.open(“GET”,url,true);
XMLHttpReq.onreadystatechange=processResponse;
XMLHttpReq.send(null);
}
//处理返回信息函数
function processResponse(){
if(XMLHttpRequest.readyState==4){
if(XMLHttpRequest.status==200){
updateMenu();
}else{alert(“您请求的页面有异常!”)}
}
}
//更新菜单函数
function updateMenu(){
var res=XMLHttpReq.responseXML.getElementIdByTagName(“res”);
var sunMenu=””;
for(var i=0;i<res.length;i++){
submenu=subMenu+res[1].fistChild.data+”<br>”;
}
currentSort.innerHTML=submenu;
}
//创建级联菜单
function showSubMenu(obj){
currentSort=document.getElementById(obj);
currentSort.parentNode.style.display=””;
sendRequest(“menu?sort=”+obj);
}
</script>
<b>EasyJF成员</b>
<a onClick=”onShowSubMenu(‘大峡’)”>大峡</a>
该页面中提供了对应的菜单以供用户选择,用户选择菜单后,调用showSubMenu(‘XXX’)函数,其中参数用于传递用户所选菜单的标识信息到服务器以决定获取服务器的哪个在菜单内容,首先获得菜单的识别信息,再提交给Ajax,这里用innerHTML属性实现定位显示 。
0
投稿
猜你喜欢
- 前边看到有人发了个层打开效果,总感觉不是很理想 个人认为:-),如果那个层放到固定的容器里面估计就会出现问题的。今天自己来写个,可以支持 在
- 每次在操作数据库的时候最烦的就是根据表单提交的内容写sql语句,特别是字段比较多的时候很麻烦,动不动就容易写错。所以我就写了下面的生成sql
- 在许多网页中,当鼠标移到一张图片上时,又弹出另一张图片,做这种广告条,要用到Macromedia DreamWeaver中的Lay
- 在 ASP 的内建对象中除了用于发送、接收和处理数据的对象外,还有一些非常实用的代表 Active Server 应用程序和单个
- JS提供两个截取字符串的方法,分别是:slice()和substring()slice和substring都可以接受一个或两个参数,第1个参
- 方法一 <%dim total(7,3) total(1,0)="ASP之家"&n
- 思想:4个数字的排列,加上3个运算符的排列,使用后缀表达式的表现如下:情形一:1,2,3,4,+,-,* => 24*24*4情形二:
- 淡入淡出图片轮换轮播效果,可以做新闻图片推荐需要的拿去用,效果预览请点击运行代码相关效果推荐:迅雷首页新闻图片轮播效果js源码 <!D
- 一、在访客的内心深处做导航我讨厌迷失,不管是在道路上或是在线网络上。猜想一下?您的访客也是这样的。就像我们期望看到的道路上的路标一样,来帮助
- 有这么一个题目,说bt其实也不bt,为了重点突出其中的意图,特意加上了括号:var a = (++Math.P
- Google以其简洁的搜索框引领着互联网,搜索系统似乎成了每个网站必备品,甚至于是那些本身几乎是由静态页面组成的企业网站都要来个搜索功能,这
- asp取得字段属性代码:set AdoX = server.createobject("adox.c
- 随着jQuery、Mootools、prototype等知名的JavaScript框架的应用变的越来越强大,浏览器对最新版本CSS属性的支持
- 又忙忙碌碌的的过了一个月,但都在瞎忙,忙得没有一点效率也没有一点价值。忙完之后静下来我就在想,这种情况要持续到什么时候是个头啊~~~网站是一
- 看了不少朋友的个人网站,有一个小问题,似乎很多朋友都忽略了,那就是版权声明的写法。虽然那只是一小行字,不过作为设计师也好,作为个人的爱好也好
- myisam_max_[extra]_sort_file_size足够大delay_key_write减少io,提高写入性能bulk_ins
- 如果要问做什么事是最有吸引力,那就是创建Web应用。Web设计者们对设计交互式的Web没有什么更好的办法,却对我们做桌面软件的同事投去少许羡
- 内容摘要:最近逛论坛经常看到有朋友问上传文件怎么重命名,怎么以当前日期来重命名上传文件。现在我就介绍一下重命名的方法,希望对大家有所帮助。本
- 我在前几天的博客中翻译了一篇《20个对学习CSS3大有裨益的资源》的文章,其中推荐了Get started with CSS 3,本文为其中
- sql="select * from admin where users='"&users&&q