手机端移动端的选择框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  剩下的就是获取数据了  本文不在描述

相关文章