手機端移動端的選擇框mobileSelect.js使用

手機端移動端的選擇框mobileSelect.js使用

文件地址：https://github.com/onlyhom/mobileSelect.js 

請感興趣的自行下載

 

使用過程

1 引入標簽

<link rel="stylesheet" type="text/css" href="css/mobileSelect.css">

<script src="js/mobileSelect.js" type="text/javascript"></script>

這里我引入的是mini 其實一樣用

 

2 數據初始化

//獲取物流公司信息
        $delivery=model('Delivery');
        $expressComList=$delivery->expressName;
        $data=array();
        $i=0;
        foreach($expressComList as $k=>$v){
            $data[$i]['id']=$k;
            $data[$i]['value']=$v;
            $i++;
        }
        $this->assign('expressComList',json_encode($data));

 

3 使用普通數組的聯動

<p><input type="text" id="express_trigger" name="express_name"  class="placeholder_99" placeholder="物流公司" /></p>

JS 函數部分

var mobileSelect = new MobileSelect({
        trigger: '#express_trigger',
        title: '單項選擇', 
        wheels: [
                    {data:{$expressComList}}
                ],
        position:[2], //初始化定位
        callback:function(indexArr, data){
            mobileSelect.position=[indexArr];
            $('#express_code').val(data[0].id);
            $('#express_trigger').val(data[0].value);
        } 
    });

 

 

 4  剩下的就是獲取數據了  本文不在描述