移動端省際聯動插件mobiscroll

<link href="assets/css/mobiscroll.custom-2.17.0.min.css" rel="stylesheet" type="text/css" />

<script src="assets/js/mobiscroll.custom-2.17.0.min.js" type="text/javascript"></script>

//html

<ol class="treelist-sex" id="menusex">
                <li>男</li>
                <li>女</li>
            </ol>

    <select id="demo" class="all_width ">
            <optgroup label="濟南">
                <option value="1">歷下區</option>
                <option value="2">市中區</option>
                <option value="3">天橋區</option>
                <option value="4" selected="selected">歷城區</option>
            </optgroup>

            <optgroup label="濱州">
                <option value="15">濱城區</option>
                <option value="16">西海區</option>
            </optgroup>
        </select>

 

//js

$('.treebutton-sex').click(function() {
                    $('.treelist-sex').mobiscroll('show');
                    return false;
                });
                $(".treelist-sex").mobiscroll().treelist({
                    theme: "mobiscroll",
                    display: 'bottom',
                    lang: "zh",
                });

// js 地址選擇控件(可顯示多行)
                $('#city-picker').click(function() {
                    $('#demo').mobiscroll('show');
                    return false;
                });
$('#demo').mobiscroll().select({
    theme: 'mobiscroll',
    display: 'bottom',
    label: 'City',
    lang: "zh",
    group: true,
    groupLabel: 'Country',

//不允許右側控制左側

group: {
    clustered: true
}
    //選擇表單展現的樣式
    inputClass:"all_width text-right clear_border"
//  fixedWidth: [100, 170]
});