三级联动下拉框
Ghost 发表于 [2005-12-23 16:19]
<FORM name="isc">
<table border="0" cellspacing="0" cellpadding="0">
<tr align="center">
<td nowrap height="11">
<select name="example" size="1" onChange="redirect(this.options.selectedIndex)">
<option selected>---Select1-------------</option>
<option>Webmaster Sites</option>
<option>News Sites</option>
</select>
<select name="stage2" size="1" onChange="redirect1(this.options.selectedIndex)">
<option value=" " selected> </option>
<option value=" " selected>---Select2--------------</option>
<option value=" " selected>---Select2--------------</option>
</select>
<select name="stage3" size="1" onChange="redirect2(this.options.selectedIndex)">
<option value=" " selected> </option>
<option value=" " selected>---Select3----------------</option>
<option value=" " selected>---Select3----------------</option>
</select>
<script>
<!--
var groups=document.isc.example.options.length
var group=new Array(groups)
for (i=0; i<groups; i++)
group[i]=new Array()
group[0][0]=new Option("---Select2---"," ");
group[1][0]=new Option("Now Select This One"," ");
group[1][1]=new Option("JavaScript","47");
group[1][2]=new Option("DHTML","46");
group[1][3]=new Option("CGI","45");
group[2][0]=new Option("Now Select This One"," ");
group[2][1]=new Option("General News","115");
group[2][2]=new Option("Technology News","116");
var temp=document.isc.stage2
function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
redirect1(0)
}
var secondGroups=document.isc.stage2.options.length
var secondGroup=new Array(groups)
for (i=0; i<groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j<group[i].length; j++) {
secondGroup[i][j]=new Array() }}
secondGroup[0][0][0]=new Option("---Select 3---"," ");
secondGroup[1][0][0]=new Option("---Select 3---"," ");
secondGroup[1][1][0]=new Option("Now Select This One"," ");
secondGroup[1][1][1]=new Option("Website Abstraction"," ");
secondGroup[1][1][2]=new Option("JavaScript for the non programmer"," ");
secondGroup[1][1][3]=new Option("Java-Scripts.net"," ");
secondGroup[1][2][0]=new Option("Now Select This One"," ");
secondGroup[1][2][1]=new Option("Dynamic Drive"," ");
secondGroup[1][2][2]=new Option("Beginner\'s Guide to DHTML"," ");
secondGroup[1][2][3]=new Option("Web Coder"," ");
secondGroup[1][3][0]=new Option("Now Select This One"," ");
secondGroup[1][3][1]=new Option("CGI Resources","");
secondGroup[1][3][2]=new Option("Ada\'s Intro to CGI"," ");
secondGroup[2][0][0]=new Option("---Select 3---"," ");
secondGroup[2][1][0]=new Option("Now Select This One"," ");
secondGroup[2][1][1]=new Option("CNN"," ");
secondGroup[2][1][2]=new Option("MSNBC"," ");
secondGroup[2][1][3]=new Option("ABC News"," ");
secondGroup[2][2][0]=new Option("Now Select A Page"," ");
secondGroup[2][2][1]=new Option("News"," ");
secondGroup[2][2][2]=new Option("Wired"," ");
var temp1=document.isc.stage3
function redirect1(y){
for (m=temp1.options.length-1;m>0;m--)
temp1.options[m]=null
for (i=0;i<secondGroup[document.isc.example.options.selectedIndex][y].length;i++){
temp1.options[i]=new Option(secondGroup[document.isc.example.options.selectedIndex][y][i].text,secondGroup[document.isc.example.options.selectedIndex][y][i].value)
}
temp1.options[0].selected=true
}
function redirect2(z){
window.location=temp1[z].value
}
//-->
</script>
</td>
</tr>
</table>
</FORM>
分享到:
相关推荐
在ASP中,二级联动和三级联动下拉框是常见的功能,通常用于实现数据的筛选和过滤,例如在地区选择、商品分类等场景。下面将详细讲解如何在ASP中实现这些功能。 ### 二级联动下拉框 二级联动下拉框是指两个下拉框...
本项目"基于layui开发的省市区三级联动下拉框"是一个典型的前端组件开发实例,它利用layui和vue.js来实现地理信息的三级联动选择功能。 首先,我们来了解一下layui。layui是一款中国本土的开源前端框架,它提供了...
jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框
这个三级联动下拉框的设计很容易扩展到四级或五级。只需在数据结构中添加更多的层级,如`town`或`street`,并在JavaScript中相应地增加逻辑处理即可。每次用户选择一个级别,就更新下一级别的下拉框,直到达到最后一...
### JS三级联动下拉框知识点解析 #### 一、知识点概览 在Web开发中,三级联动下拉框是一种常见的用户交互方式,主要用于提供多级数据选择的功能,比如省份、城市、区县的选择等场景。该功能通过JavaScript实现,...
在网页设计和开发中,"三级联动下拉框"是一种常见的交互元素,它通常用于实现多级关联选择,比如省份-城市-区县的选择。这种功能可以极大地提高用户体验,尤其是在处理大量分类信息时。下面我们将深入探讨这个话题,...
在IT领域,"AJAX版省市区三级联动下拉框"是一种常见的前端交互设计,尤其在网站表单中,用于用户选择地理位置时。这个技术基于AJAX(Asynchronous JavaScript and XML),它允许网页在不刷新整个页面的情况下与...
本示例中提到的"简单的vue三级联动下拉框代码"是Vue.js应用场景的一个常见实例,常用于构建复杂的表单组件,如地区选择、商品分类筛选等。 一、Vue.js 三级联动下拉框基础概念 1. Vue.js:Vue.js 是一套用于构建...
### Ajax实现三级联动下拉框的关键技术点与实践 在现代Web开发中,动态加载数据并更新页面元素的能力是提升用户体验的重要手段之一。三级联动下拉框作为一个常见的交互设计,常用于显示具有层级关系的数据,如省份...
在网页设计和开发中,"三级联动下拉框"是一种常见的交互形式,它通常用于处理层级关系的数据,如行政区划、商品分类等。这个技术的关键在于通过JavaScript或者jQuery等前端库来实现各个下拉框之间的联动效果。当用户...
在网页设计中,三级联动下拉框是一种常见的交互元素,常用于地区选择、商品分类等场景,用户在一级、二级下拉框中选择后,三级下拉框会根据前两级的选择动态更新其选项。这种功能的实现主要依赖JavaScript,配合HTML...
最近接触layui,比较简洁美观的一款ui,但也有很多小坑,记录一下实现省市区下拉三级联动更新回显的问题 <%--监听省份选择 --%> form.on('select(uprovinceId)', function(data){ initCityList('change')...
在网页设计中,三级联动下拉框是一种常见的交互元素,特别是在数据层级结构比较复杂的场景下,如地区选择、产品分类等。它通过三个下拉菜单的级联关系,让用户能够逐步细化选择,从大类到小类,最终精确地选取目标...
在IT开发领域,尤其在前端开发中,"layui-省市县三级联动下拉框效果"是一种常见的需求,常用于地址选择、区域筛选等场景。Layui是一个优秀的国产前端UI框架,它提供了丰富的组件和API,使得开发者可以方便地实现各种...
Excel 三级 联动 下拉框 宏代码 实例 代码注释 先在第一个下拉框加入一个valiation, 内容是 =$A$2:$A$5 Private Sub Worksheet_Change(ByVal Target As Range) ' Call back function which defined within ...
在构建省市区三级联动下拉框时,我们可以利用其提供的行政区划数据。 1. **获取数据**: 百度地图提供了JSON格式的行政区划数据,可以通过API接口获取。通常,这些数据包括省份、城市、区县等各级行政区域的信息。...
在网页设计和开发中,"省,市,区三级联动下拉框" 是一个常见的功能需求,主要用于用户在填写地址信息时提供便捷的选择方式。这种设计通常涉及到前端交互和后端数据支持,使得用户能够在选择省份后,下拉框自动更新...
在前端开发中,"jQuery全国高校三级联动下拉框"是一个常见的交互功能,它主要用于实现用户在选择高校时,根据一级、二级、三级行政区域进行筛选。这种功能常见于招生报名系统、招聘信息发布平台等,提供了便捷的用户...
"基于layui开发的省市区三级联动下拉框"是一个典型的前端组件,它利用layui框架来实现一个功能强大的交互式选择器,帮助用户在网页上便捷地选择省份、城市和区县。 layui是一款轻量级的前端UI框架,它的设计目标是...