-
如何实现级联的导航条(navigation)效果？5
导航条是这样的效果：中国-山东-济南 历下区 市中区 槐荫区。把鼠标放到中国上自动下拉列出全国的省份，把鼠标放到济南上自动下拉列出济南的所有区。想要这个效果的目的是让网站浏览者能很容易的跳转到不同地区。参考网站是：http://www.samulu.com/catalog/01012008年6月26日 11:38
添加评论
关注(0)2个答案 按时间排序 按投票排序
-
采纳的答案
在数据库中存储数据时
以 id | pid | area
的方式存储,
id为地区的ID,pid为该地区的父节点(若为顶级节点,如中国,则为一个不存在的值如-1).
当页面第一次加载时生成所有的顶级节点.
然后写一个页面getData.jsp,接收id,查询数据库,获取该pid值为id的所有数据,将数据排成特定格式进行返回.
//获取数据 function getData(id){ ... //这里也可以改为异步获取,为了代码简单,所以写成同步了. xmlHttp.open("GET","getData.jsp?id="+id,false); xmlHttp.send(); return xmlHttp.responseText; ... } //创建面板 function createPanel(id){ var content=getData(id); //解析content的数据 ... var panel = document.createElement("div"); ... panle.innerHTML=...; panel.className=...; panel...; ... document.body.appendChild(panel); }
当鼠标移到一个节点上时,就调用createPanel方法,并将该节点在数据库中的id传过去.之后用Ajax获取数据,并生成一个div.通过得到数据生成它的内容,控制它显示的位置.就可以实现了.
大概的逻辑就是这样了.
如果觉得写得太抽象了...LZ别介意.2008年6月26日 18:40
-
这个可以使用css和div层来实现你要的视觉效果，数据通过dwr的局部刷新来处理
不一定非用dwr，随便一个ajax技术都可以，只要可以局部刷新就可以了2008年6月26日 14:34
相关推荐
6. CSS样式应用：最后，使用CSS确保级联选择器的视觉效果一致且易于使用。 总的来说，这个实例展示了如何结合使用jQuery、JSP、JavaScript和CSS来实现一个功能完善的级联地区选择器，这在网页开发中非常实用，尤其...
在Android开发中，实现区域级联选择效果，通常是指创建一个类似于下拉菜单的效果，其中一项选择会引发下一级别的选项出现，这种交互设计被称为级联菜单或联动菜单。这样的功能常见于地理位置选择，例如省份-城市-...
在本项目中，Ajax被用来实现级联菜单的效果，即一个下拉菜单的选择会影响另一个下拉菜单的内容，这种交互方式常见于数据层级关系丰富的表单中。下面将详细介绍Ajax实现级联菜单的相关知识点。 1. **异步通信**： ...
### JSP实现级联菜单详解 #### 一、概述 级联菜单是Web应用程序中常见的一种交互设计方式，尤其在需要展示多层级数据结构时，如省份-城市选择器等场景下非常实用。通过级联菜单，用户可以方便地根据上一级的选择来...
本文将深入探讨如何使用jQuery实现级联效果，这种效果常见于下拉菜单、多级选择器和联动筛选等场景。级联效果意味着一个选择会影响另一个相关的选择，从而提供更精细的用户交互体验。 首先，级联效果通常涉及到多个...
在这个特定的场景中，"实现级联效果"可能是指通过编程或配置来创建一种多层交互或依赖的效果。下面我们将详细探讨级联在不同领域的应用，并给出实现这种效果的具体方法。 1. **CSS级联样式表**： CSS（Cascading ...
省市区三级联动实现
用JS实现了级联，未涉及到ajax 或jquery ajax；感觉方法很新颖，特传上来供大家参考。
菜单级联菜单级联菜单级联菜单级联菜单级联菜单级联菜单级联
xml实现级联菜单，很简单，完全不需要Ajax，但实现了Ajax的效果
AJAX（Asynchronous JavaScript and XML）技术可以有效地实现级联菜单的动态加载和交互，无需刷新整个页面即可获取并显示数据。 **AJAX** 是一种在不重新加载整个网页的情况下，与服务器交换数据并更新部分网页的...
在计算机软件中，级联菜单的实现是一个关键的交互设计环节，它能提升用户体验，使得复杂的操作更加直观。本篇文章将深入探讨如何在不同编程环境中实现级联菜单，并通过一个实际的例子来演示其工作原理。 首先，我们...
在这个“jQuery+ajax实现三级级联”的实例中，我们主要探讨如何利用这两种技术来创建一个能够逐级联动的下拉菜单系统，这在数据筛选和表单填写中十分常见，如地区选择、部门分类等场景。 首先，jQuery是一个轻量级...
级联菜单常用于导航栏或选择项，它允许用户按层次结构选择选项。在征婚网站中，可能有如地区、年龄、性别等属性，级联菜单能帮助用户更方便地筛选和查找合适的人选。JavaScript可以通过操作DOM（文档对象模型）来...
实现级联下拉框效果，我们通常需要两个或多个`<select>`元素，并通过JavaScript监听第一个下拉框的`change`事件。当用户更改选择时，触发事件处理函数，根据选定的值动态更新第二个下拉框的选项。 以下是一个简单的...
这个插件通过添加额外的CSS和JavaScript，使得用户在点击主菜单项后，不仅可以展开子菜单，还可以进一步展开子菜单的子菜单，形成多级联动的级联导航效果。 要使用`bootstrap-submenu`插件，首先需要引入相关的JS和...
利用javascript+json实现级联查询
级联菜单级联菜单级联菜单级联菜单级联菜单级联菜单级联菜单级联菜单级联菜单级联菜单
### SQL Server 创建触发器实现级联删除 在数据库管理中，触发器是一种特殊类型的存储过程，它被设计为响应特定的事件（如插入、更新或删除数据）而自动执行。本文将详细介绍如何在 SQL Server 中创建一个触发器来...
c# winform datagridview 中嵌套的combobox实现级联选择