基于picker的省市区联动选择器-html代码-BFW代码库

基于picker的省市区联动选择器

代码语言：html

所属分类：选择器

代码描述：基于picker的省市区联动选择器

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/picker.min.js"></script>
        <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/city.js"></script>
   
    <style>
    </style>
</head>
<body>
<input type="text" id="picker" placeholder="每次点击数据联动">
 <script type="text/javascript">
        var nameEl = document.getElementById('picker'); var first = []; var second = []; var third = []; var selectedIndex = [0, 0, 0]; var checked = [0, 0, 0]; function creatList(obj, list) {
            obj.forEach(function(item, index, arr) {
                var temp = new Object(); temp.text = item.name; temp.value = index; list.push(temp);
            })}
        creatList(city, first); if (city[selectedIndex[0]].hasOwnProperty('sub')) {
            creatList(city[selectedIndex[0]].sub, second);
        } else {
            second = [{
                text: '',
                value: 0
            }];
        }
        if (city[selectedIndex[0]].sub[selectedIndex[1]].hasOwnProperty('sub')) {
            creatList(city[selectedIndex[0]].sub[selectedIndex[1]].sub, third);
        } else {
            third = [{
                text: '',
                value: 0
            }];
        }
        var picker = new Picker({
            data: [first, second, third], selectedIndex: selectedIndex, title: '地址选择'
        }); picker.on('picker.select', function(selectedVal, selectedIndex) {
            var text1 = first[selectedIndex[0]].text; var text2 = second[selectedIndex[1]].text; var text3 = third[selectedIndex[2]]?third[selectedIndex[2]].text: ''; nameEl.value = text1+' '+text2+' '+text3;
        }); picker.on('picker.change', function(index, selectedIndex) {
            if (index ==.........完整代码请登录后点击上方下载按钮下载查看