模拟ios下拉框样式

文档
仓库地址

1
2
3
4
<div class="pc-box">                     
    <input type="hidden" name="bank_id" id="bankId" value="">                     
    <span id="showBank">点击这里选择银行</span>  
</div>  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
var data = [
    {'id': '10001', 'value': '<b>工商银行</b><i>ICBC</i>'},
    {'id': '10002', 'value': '<b>农业银行</b><i>ABC</i>'},
];
var showBankDom = document.querySelector('#showBank');
var bankIdDom = document.querySelector('#bankId');
showBankDom.addEventListener('click', function () {
    var bankId = showBankDom.dataset['id'];
    var bankName = showBankDom.dataset['value'];

    var bankSelect = new IosSelect(1, 
        [data],
        {
            container: '.container',
            title: '银行卡选择',
            itemHeight: 50,
            itemShowCount: 3,
            oneLevelId: bankId,
            callback: function (selectOneObj) {
                bankIdDom.value = selectOneObj.id;
                showBankDom.innerHTML = selectOneObj.value;
                showBankDom.dataset['id'] = selectOneObj.id;
                showBankDom.dataset['value'] = selectOneObj.value;
            }
    });
});