HTML的下拉列表框的问题

我要做1个HTML网页,一共有2个下拉列表...我要做到:第1个列表里选择了|上海|那在第2个下拉列表里就出现上海的所有区例:|上海||长宁区|我直接复制到里面去没用的.... 我要做1个HTML网页,一共有2个下拉列表...
我要做到:
第1个列表里选择了 |上海| 那在第2个下拉列表里就出现上海的所有区

例:
|上海| |长宁区|
我直接复制到里面去没用的...
<script language="javascript" src="hpmenu.js">
最下面的javascript好象于是写这里面的
</script>

但我加进去也不行...不知道哪里不对... 展开

 我来答

6个回答

#热议# 生活中有哪些实用的心理学知识？

百度网友41da067
推荐于2017-09-18 · TA获得超过192个赞

知道小有建树答主

回答量：294

采纳率：100%

帮助的人：194万

我也去答题访问个人页

关注

展开全部

一共两个文件,html页面里面调用js文件就可以了,不是要把代码也复制到html文件里面^……

联动菜单是这个意思吗?
实现方法很多推荐一个比较好的:琥珀联动菜单
以下信息为琥珀联动菜单：（在此感谢作者！）
下面是静态页面：HPMenu_Demo.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>琥珀网 - javascript无限级联动菜单</title>
<style type="text/css">
body, td
{
font-family: 宋体;
font-size: 12px;
}
</style>
<script language="javascript" src="hpmenu.js"></script>
</head>
<body>
<form name="form1" method="post" action="">
<table width="90%" border="0" align="center" cellpadding="2" cellspacing="1" bgcolor="#CCCCCC">
<tr bgcolor="F1F1F1">
<td height="24" colspan="2" align="center">琥珀无限级联动菜单-JavaScript版 [HPMenu V1.0]</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="12%" height="24" align="center">所在洲:</td>
<td><select name="zhou" id="zhou" onChange="Menu(this.form,1);">
<option value="" selected>-----请选择-----</option>
<option value='欧洲'>欧洲</option>
<option value='亚洲'>亚洲</option>
<option value='非洲'>非洲</option>
<option value='大洋洲'>大洋洲</option>
<option value='北美洲'>北美洲</option>
<option value='南美洲'>南美洲</option>
</select></td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="24" align="center">国家:</td>
<td><select name="guo" id="select" onChange="Menu(this.form,2);">
<option value="" selected>-----请选择-----</option>
</select></td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="24" align="center">城市:</td>
<td><select name="shi" id="select2" onChange="Menu(this.form,3);">
<option value="" selected>-----请选择-----</option>
</select></td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="24" align="center">地区:</td>
<td><select name="qu" id="select3">
<option value="" selected>-----请选择-----</option>
</select></td>
</tr>
<tr bgcolor="F1F1F1">
<td height="24" colspan="2" align="center"> </td>
</tr>
</table>
<br>
<script language="javascript">
Menu(eval("document.form1"),1)
</script>
</form>
</body>
</html>

下面是调用的js ：HPMenu.js
function Menu(theform,menuid) {
/*---------------------------------------------------------------------------*\
* 1.变量定义 *
/*---------------------------------------------------------------------------*/

//定义菜单级别MenuClass,菜单长度数组MenuLenArr,菜单名称数组MenuArr,下级菜单数组SubMenuArr，菜单ID数组MenuIdArr
var MenuClass,MenuLenArr,MenuArr,SubMenuArr,MenuIdArr

//定义分隔符：splitchar1,splitchar2
var splitchar1,splitchar2

//定义临时数组,子数组,数组长度,
var arr,subarr,arrlen

/*---------------------------------------------------------------------------*\
* 2.变量赋值 *
/*---------------------------------------------------------------------------*/
MenuArr=new Array()
MenuLenArr=new Array()
SubMenuArr=new Array()
MenuIdArr=new Array()

MenuArr[1]="欧洲|||亚洲|||非洲|||大洋洲|||北美洲|||南美洲" //洲名|||...
MenuArr[2]="欧洲###德国|||欧洲###法国|||北美洲###美国|||北美洲###加拿大|||亚洲###中国" //洲名###国名|||...
MenuArr[3]="中国###北京|||中国###上海|||美国###华盛顿|||美国###纽约|||德国###柏林" //国名###城市名|||...
MenuArr[4]="北京###朝阳区|||上海###徐汇区|||广州###天河区|||纽约###曼哈顿区" //国名###城市名|||...

MenuIdArr[1]="zhou"
MenuIdArr[2]="guo"
MenuIdArr[3]="shi"
MenuIdArr[4]="qu"
MenuClass=4 //4级菜单

splitchar1="|||";
splitchar2="###";

/*---------------------------------------------------------------------------*\
* 3.生成数组 *
/*---------------------------------------------------------------------------*/
for(iii=1;iii<=MenuClass;iii++)
{
arr=MenuArr[iii].split(splitchar1);
len=arr.length;
subarr=new Array()
for (i=0;i<len;i++)
{
subarr[i]=arr[i].split(splitchar2);
}
len=subarr.length;
SubMenuArr[iii]=subarr
MenuLenArr[iii]=len
}

//============更改下级菜单======================
var self,submenu,thislen,thisarr
//self本级菜单
//submenu子菜单
//theform:所在表单对象[type:object]
//menuid:本级菜单级别ID，如1级菜单则为1
self=eval("document."+theform.name+"."+MenuIdArr[menuid])
submenu=eval("document."+theform.name+"."+MenuIdArr[menuid+1])
thislen=MenuLenArr[menuid+1]
thisarr=SubMenuArr[menuid+1]
submenu.length=0
submenu.options.add(new Option( "-----请选择-----",""));
for (i=0;i<thislen;i++)
{
if (thisarr[i][0] == self.value)
{
submenu.options.add(new Option(thisarr[i][1], thisarr[i][1]));
}
}
submenu.options[0].selected=true

//============更改下级以下菜单==============
var kkk
for(kkk=menuid+2;kkk<=MenuClass;kkk++)
{
submenu=eval("document."+theform.name+"."+MenuIdArr[kkk])
submenu.length=0
submenu.options.add(new Option( "-----请选择-----",""));
submenu.options[0].selected=true
}
}

是直接用的！

已赞过 已踩过<

评论收起

afeiqiang020
2007-05-24 · TA获得超过179个赞

知道小有建树答主

回答量：181

采纳率：0%

帮助的人：0

我也去答题访问个人页

关注

展开全部

在放列表的地方插入类似下面代码
<select name="provice">
<option value=1>上海</option>
<option value=2>。。。</option>
</select>
<select name="location">
<option value=1>...(地名1)</option>
<option value=2>...（地名2)</option>
</select>

已赞过 已踩过<

评论收起

帅聪虎伟兆
2019-04-12 · TA获得超过3755个赞

知道大有可为答主

回答量：3136

采纳率：28%

帮助的人：208万

我也去答题访问个人页

关注

展开全部

举例说明：
<option
value="1980">1983</option>
中的value="1980"是下拉框选项真正的值，而1983只是给使用者看的显示而已。
至于2个值不同，据我估计这是编码人员复制出来的，没修改过来。
selected="selected"的意思是，当程序运行时，默认选中下拉框里的此选项

已赞过 已踩过<

评论收起

邢许迮泽洋
2020-01-05 · TA获得超过3988个赞

知道大有可为答主

回答量：3119

采纳率：35%

帮助的人：207万

我也去答题访问个人页

关注

展开全部

<SELECT
onchange="if(this.options[this.selectedIndex].value!=''){showcolor(this.options[this.selectedIndex].value);this.options[0].selected=true;}else
{this.selectedIndex=0;}"
name=color>
<option
style="background-color:#F0F8FF;color:
#F0F8FF"
value="#F0F8FF">#F0F8FF</option>
<option
style="background-color:#FAEBD7;color:
#FAEBD7"
value="#FAEBD7">#FAEBD7</option>
<option
style="background-color:#00FFFF;color:
#00FFFF"
value="#00FFFF">#00FFFF</option>
</select>
类似这样子就行了，你要什么色彩，就添加上去吧！！

已赞过 已踩过<

评论收起

范靖丙如曼
2020-04-30 · TA获得超过3650个赞

知道小有建树答主

回答量：3067

采纳率：31%

帮助的人：206万

我也去答题访问个人页

关注

展开全部

具体value为何值：是你随意写的。其具体的值，要看你自己想要下拉表起什么作用
上面代码出现那种情况，可能是作者测试时随意写的
selected="selected"是要当前选中这一项

已赞过 已踩过<

评论收起

更多回答（4）

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

您可能关注的内容

Diffshop-全球电商独立站与社媒广告数据监控及选品

Diffshop店湖是一款全球电商独立站一站式数据监控及选品工具，趋势数据、爆品数据全覆盖，多功能板块帮助卖家进行竞争对手分析、选品、SEO、Listing及广告投放优化

www.diffshop.cn广告

HTML的下拉列表框的问题

您可能关注的内容

其他类似问题

为你推荐：