JS省市县三级联动输入

最新推荐文章于 2024-03-26 17:36:24 发布

CrazZy651314

最新推荐文章于 2024-03-26 17:36:24 发布

阅读量2.8k

点赞数

分类专栏： html+css 文章标签： javascript

本文链接：https://blog.csdn.net/qinqigang/article/details/78748881

版权

html+css 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

下载地址信息js：area.ui.js

地址：https://pan.baidu.com/s/1eSEShHo
密码：e2xh

用法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="js/jquery-3.2.1.js"></script>
    <script type="text/javascript" src="js/area.ui.js"></script>
    <title>省市三级联动</title>
</head>
<body>
<script type="text/javascript" >
    $(function(){
        $(document).area("s_province","s_city","s_county");//调用插件
        $('.cancel').click(function(){/*
         var pro = document.getElementById("s_province");
         var city = document.getElementById("s_city");
         var cou = document.getElementById("s_county");
         var all = pro + city + cou ;
         alert("aaaaa");*/
            var str="";
            $('#s_province').children().each(function(){
                if($(this).prop('selected')==true){
                    str+=$(this).html();
                }
            });
            $('#s_city').children().each(function(){
                if($(this).prop('selected')==true){
                    str+=$(this).html();
                }
            });
            $('#s_county').children().each(function(){
                if($(this).prop('selected')==true){
                    str+=$(this).html();
                }
            });
            str += document.getElementById('all').value;
            $('#time').val(str);

        });
    });

</script>
<select id="s_province" name="s_province" ></select>
<select id="s_city" name="s_city" ></select>
<select id="s_county" name="s_county"></select>
<input type="text" id="all" value=""/>
<button class="cancel" id="can" value="2">确定</button>
<div >

    <input type="text" id="time" size=100/>
</div>
</body>
</html>

截图

省市县三级联动

CrazZy651314

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JS省市县三级联动输入

下载地址信息js：area.ui.js地址：https://pan.baidu.com/s/1eSEShHo 密码：e2xh用法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <script type="text/javascript" src="js/jquery-3.2.1.js"></script
复制链接

扫一扫