var type=
{
首页导航:["首页导航"],
首页活动:[ '有奖问答','用户调查','直播间']
};
var searchModuleVaule=
{
首页导航:["0"],
首页活动:[ '1','2','3']
};
//加载类型
function loadType()
{
//获取类型所对应的列表框对象
var pro=document.getElementById("searchType");
//从数组中提取类型份信息
for(var p in type)
{
//创建option元素
var opt=document.createElement("option");
//设置option元素中的信息
opt.innerText=p; 123
opt.value=p;
if(p=='${searchTypeRequest}')
{
opt.selected =true;
}
//将option元素添加到select元素中(option是select的子节点)
pro.appendChild(opt);
}
if(${searchTypeRequest!=null or searchTypeRequest!=''})
{
loadSearchModule('${searchTypeRequest}') ;
}
}
//自动加载模块
function loadSearchModule(selectType)
{
//根据类型获取模块(searchModules是一个数组)
var searchModules=type[selectType];
var searchModulesValue=searchModuleVaule[selectType];
//获取模块所对应的列表框对象
var searchModule=document.getElementById("searchModule");
//将元素列表框中的元素全部清空
searchModule.innerText="";
var opt=document.createElement("option");
opt.innerText="全部";
opt.value="";
searchModule.appendChild(opt);
for(var index=0;index<searchModules.length;index++)
{
opt=document.createElement("option");
opt.innerText=searchModules[index];
opt.value=searchModulesValue[index];
if(opt.value=='${searchModule}')
{
opt.selected =true;
}
searchModule.appendChild(opt);
}
}
//测试用
function test()
{
var selectCity=document.getElementById("searchModule").value;
alert(selectCity);
}
//在窗口加载时添加类型信息
window.onload=loadType;
分享到:
相关推荐
总的来说,制作JavaScript级联下拉特效是一个很好的实践项目,它涵盖了基本的JavaScript编程、DOM操作以及响应式设计的核心概念。通过这个过程,你可以提升你的JavaScript编程技巧,并为你的网页增添更丰富的交互性...
纯JS级联下拉框,可以帮助拓展思路
JavaScript级联菜单是一种常见的网页交互元素,用于呈现层次结构的数据,如导航菜单、下拉选项等。这种菜单在用户界面上提供了高效的导航,允许用户通过展开和折叠子菜单来探索多级内容。在这个主题中,我们将深入...
在JavaScript的世界里,级联菜单(Cascading Menu)是一种常见的交互设计,它通常用于下拉选择框,其中的选择项会根据用户先前的选择动态改变。本示例将深入讲解如何利用jQuery库来实现这种功能。jQuery是JavaScript...
在JavaScript和jQuery的世界里,级联选择是一种常见的交互设计,...总之,"js 级联选择地区"是一种实用的前端交互设计,结合JavaScript和jQuery可以轻松实现。理解其工作原理和实现方法对于提升网页交互体验至关重要。
js 级联菜单例子,简单实用
当Java文本编辑器与JavaScript级联相结合时,可能的场景是在一个Java应用程序中集成一个Web视图,这个视图可以显示和编辑由JavaScript驱动的HTML内容。例如,使用JavaFX的WebView组件,开发者可以在Java应用中嵌入一...
JS级联实例代码
4. **前端交互**:在前端页面上,使用JavaScript(通常配合jQuery或Vue、React等框架)实现级联效果。当你选择一个省份时,发送请求获取该省份的所有城市,并更新城市下拉列表。同理,选择城市后,更新区县列表。这...
js 级联省 市 县
在网页开发中,"js 级联城市"通常指的是使用JavaScript实现的一种交互效果,它允许用户逐级选择地理位置,例如国家、省份、城市,这种级联选择在很多商业网站中非常常见,如电商网站的收货地址填写、地图应用等。...
javascript 级联下拉列表 正则表达式
本文件属于文章《使用面向对象的方式封装js级联下拉菜单列表的实例教程》的完整代码,在读完原创文章之后可以下载查看代码。代码中cascadeMenu.js文件封装了级联菜单插件,可直接引入到html文件中使用。
总结,js和html编写的级联菜单结合了前端和后端的技术,通过JavaScript实现了动态交互和数据获取,HTML提供了结构基础,而数据库则为菜单提供了数据源。这种技术组合使得网页可以提供丰富的交互性和实时性,极大地...
Cascader.js是一款基于JavaScript的级联选择器组件,主要用于在Web应用中实现多级联动下拉菜单的效果。这种组件在数据层级关系较为复杂的场景中尤为常见,例如地区选择、产品分类、部门结构等。Cascader.js以其轻量...
JavaScript(简称JS)是一种广泛用于网页和网络应用的编程语言,尤其在前端开发中起着至关重要的作用。级联插件(Cascading Plugin)在JS中通常指的是能够实现下拉菜单、级联选择等功能的组件。这类插件极大地提高了...
在本项目"jsp+db的js级联菜单"中,我们看到它利用了Java Server Pages (JSP) 和 JavaScript 技术,并结合数据库来动态生成级联菜单。 JSP是Java的一种视图技术,用于在服务器端生成HTML或其他类型的Web内容。开发者...
在JavaScript(JS)中,级联菜单是一种常见的交互设计元素,常见于网站的导航栏,用于展示多级分类。级联菜单允许用户在一个下拉菜单中选择多个层次的选项,通常伴随着点击事件来展开或收起子菜单。下面将详细介绍...
利用JavaScript(JS)可以方便地实现这种功能,提供用户友好的交互体验。下面将详细介绍如何使用JavaScript实现全国省市的二级级联下拉菜单。 首先,我们需要一个HTML结构来承载我们的菜单。在这个例子中,我们有两...
**级联选择器(Cascader)在JavaScript中的应用** 级联选择器,通常被称为级联下拉框或树形下拉菜单,是一种常见的用户界面元素,尤其在数据层次结构复杂的情况下,它允许用户逐级浏览和选择数据。在JavaScript开发...