当前位置： 移动技术网 > IT编程>开发语言>JavaScript > mui框架 选择器的使用

mui框架 选择器的使用

2018年11月23日  | 移动技术网IT编程  | 我要评论

js、css引用

<script type="text/javascript" src="librarys/mui/js/mui.min.js"></script>
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>

<link rel="stylesheet" href="librarys/mui/css/mui.picker.min.css" />
<script type="text/javascript" src="librarys/mui/js/mui.picker.min.js"></script>

 

html

<div><span>选择套餐</span><i placeholder="点击选择套餐" id="showuserpicker"></i></div>

 

js

document.queryselector('#showuserpicker').addeventlistener("tap", function() {
       var roadpick = new mui.poppicker();//获取弹出列表组建，假如是二联则在括号里面加入{layer:2}
       roadpick.setdata([{//设置弹出列表的信息，假如是二联，还需要一个children属性
                 value: "1",
                 text: "套餐一"
       }, {
                 value: "2",
                 text: "套餐二"
      }]);
      roadpick.show(function(item) {//弹出列表并在里面写业务代码
              var itemcallback=roadpick.getselecteditems();
              $('#showuserpicker').html(itemcallback[0].text);
     });
});

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网