JS实现的省份级联实例代码

 更新时间:2013年06月24日 11:10:34   投稿:shangke  
这篇文章主要介绍了js下省份级联效果,需要的朋友可以参考一下

这是从本人以前博客带过来的,感觉这个还蛮实用,代码分享下:

province.html:

复制代码 代码如下:

<html>
    <head>
    <title>省份与省市级联</title>
    </head>
<script language="javascript" src="province.js" type="text/javascript" charset="gb2312"></script>
 
</script>
<body onload='getProvince()'>
<div id='province'><select><option>省份</option></select></div>
<div id='city'><select><option>城市</option></select></div>
 
</boydy>
 
</html>

province.js:

    function getRegion()
    {
        
        
        document.getElementById("city").innerHTML="";
        var provinces=document.getElementById("provinces");
        var prov=provinces[provinces.selectedIndex].value;
        var str="<select>";
        
            for(var i=0;i<city[prov].length;i++)
            {        
                str=str+"<option>"+city[prov][i]+"</option>";    
            }
            str=str+"</select>";
    document.getElementById("city").innerHTML=str;
            
    }
    function getProvince()
    {    var strs="<select onchange='getRegion()' id='provinces'><option></option>";
        for(var i=0;i<=33;i++)
        {
            strs=strs+"<option value="+i+">"+city[i][0]+"</option>";
        }    
        strs=strs+"</select>";
        document.getElementById('province').innerHTML=strs;
    }
[/code]

相关文章

  • uni-app h5端在jenkins构建报错解决

    uni-app h5端在jenkins构建报错解决

    这篇文章主要为大家介绍了uni-app h5端在jenkins构建报错解决,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-06-06
  • JavaScript或jQuery 获取option value值方法解析

    JavaScript或jQuery 获取option value值方法解析

    这篇文章主要介绍了JavaScript或jQuery 获取option value值方法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-05-05
  • 微信小程序自动化部署的全过程

    微信小程序自动化部署的全过程

    由于微信小程序需要在微信小程序助手上发布,比较麻烦,可以配置CI 自动化的发布,下面这篇文章主要给大家介绍了关于微信小程序自动化部署的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-07-07
  • JavaScript事件方法(实例讲解)

    JavaScript事件方法(实例讲解)

    下面小编就为大家带来一篇JavaScript事件方法(实例讲解)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • js实现拉伸拖动iframe的具体代码

    js实现拉伸拖动iframe的具体代码

    这篇文章介绍了js实现拉伸拖动iframe的具体代码,有需要的朋友可以参考一下
    2013-08-08
  • 拖动时防止选中

    拖动时防止选中

    本文主要介绍了拖动时防止选中的小知识点。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • JavaScript中arguments.callee属性的作用与替换方案

    JavaScript中arguments.callee属性的作用与替换方案

    这篇文章介绍了JavaScript中arguments.callee属性的作用与替换方案,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-06-06
  • javascript不同页面传值的改进版

    javascript不同页面传值的改进版

    改进点:支持同页面有多个文本框,可自动向不同的文本框传值。先看演示吧
    2008-09-09
  • javascript实现div浮动在网页最顶上并带关闭按钮效果实例

    javascript实现div浮动在网页最顶上并带关闭按钮效果实例

    我们有时会看到有些网站最顶部一直会跟着我们滚动而滚动了,这种方法其实很简单,下面我来给大推荐一个javascript实现div浮动在网页最顶上并带关闭按钮效果
    2013-08-08
  • js混淆加密之jsjiami.v6分析

    js混淆加密之jsjiami.v6分析

    这篇文章主要为大家介绍了js混淆加密之jsjiami.v6分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-05-05

最新评论