不刷新页面改变下拉菜单内容

最新推荐文章于 2024-10-18 11:12:30 发布

faunjoe

最新推荐文章于 2024-10-18 11:12:30 发布

阅读量625

点赞数

分类专栏： javascrip 文章标签： javascript function 数据库脚本 html null

本文链接：https://blog.csdn.net/faunjoe/article/details/4227782

版权

javascrip 专栏收录该内容

120 篇文章 0 订阅

订阅专栏

在设计数据库查询页面时，下拉菜单是经常使用的元素。很多时候你会希望选择了下拉菜单的一项后，相应的另一下拉菜单的内容会随之改变。这种功能可以通过刷新页面来实现，但界面显得不那么友好。在本文介绍例子中，不需要刷新页面便可达到目的。当在下拉菜单中选择了一个省份后，另一下拉菜单会出现该省份的一些城市供选择。我的基本思路是：在客户端脚本中，把下拉菜单可能会出现的所有内容预先存放于数组中，以后根据需要从数组中抽取数据写入下拉菜单中。以下是完整的代码：
            <HTML>
            <HEAD>
            <TITLE>动态改变下拉菜单内容示例</TITLE>
            </HEAD>
            <SCRIPT LANGUAGE=JavaScript>
            
            </SCRIPT>
            <BODY ONFOCUS=ChangeCity()>
            <H3>选择你所在的省份及城市</H3>
            <FORM NAME="frm">
            <P>省份：
            <SELECT NAME="optProvince" SIZE="1" ONCHANGE=ChangeCity()>
            <OPTION>--请选择--</OPTION>
            <OPTION>广东省</OPTION>
            <OPTION>湖南省</OPTION>
            <OPTION>浙江省</OPTION>
            </SELECT>
            </P>
            <P>城市：
            <SELECT NAME="optCity" SIZE="1">
            <OPTION>--请选择--</OPTION>
            </SELECT>
            </P>
            </FORM>
            </BODY>
            </HTML>