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

標籤：sign   only   NPU   手機   定位   擷取資料   class   plain   name   

手機端移動端的選擇框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  剩下的就是擷取資料了  本文不在描述

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