mobile插件单选与多选的混合

所属分类:输入,APP模板-选择框,其他

 6927  78  查看评论 (1)
分享到微信朋友圈
X
mobile插件单选与多选的混合 ie兼容11

更新时间:2020-11-09 01:27:14

这款插件的使用主要是mobileSelect.js和mobileSelect.css的引入,建议在网上搜索mobileSelect的文档,里面关于mobileSelect中方法的使用和介绍,但具体的根据不同的功能要自己用js或者jq进行插件的修改,一般的mobileSelect中都是等点击的时候才弹出弹窗,但是我们可以在其js文件中进行修改,在MobileSelect.prototype方法中添加  

_this.show()

直接显示,然后在页面需要的时候自己用js手动的让他显示和隐藏,其中的trigger属性是触发这个函数的关键属性,可以绑定一个类名或id名等等。也可以在其中设置确认和取消按钮的文本,改插件就把取消按钮给隐藏了。

具体方法请看详细文档参数 

选项 默认值 类型 描述

trigger 必填参数 无默认值 String 触发对象的id/class/tag 

wheels 必填参数 无默认值 Array 数据源,需要显示的数据 

title '' String 控件标题 position [0,0,0,…]Array 初始化定位 

connector ' ' String 多个轮子时,多个值中间的连接符,默认是空格 

callback function(indexArr, data){} function 选择成功后触发的回调函数,返回indexArr、data transitionEnd function(indexArr, data){} function 每一次手势滑动结束后触发的回调函数,返回indexArr、data ensureBtnText '确认' String 确认按钮的文本内容 

cancelBtnText '取消' String 取消按钮的文本内容 

ensureBtnColor '#1e83d3' String 确认按钮的文本颜色 

cancelBtnColor '#666666' String 取消按钮的文本颜色 

titleColor '#000000' String 控件标题的文本颜色 

titleBgColor '#ffffff' String 控件标题的背景颜色 

textColor '#000000' String 轮子内文本的颜色 

bgColor '#ffffff' String 轮子背景颜色 

keyMap {id:'id', value:'value', childs:'childs'} Object 字段名映射,适用于字段名不匹配id,value,childs的数据格式 triggerDisplayData true Boolean 在点击确认时,trigger的innerHtml是否变为选择的数据。 (如果trigger里面还有其他元素,则可以设置为false;如果需要在别的地方显示数据,则可用callback返回的数据自行拼接) 

注:回调函数中返回的参数含义如下 

indexArr是当前选中的索引数组 如[0,0,1] 代表有三个轮子 选中的数据是第一个轮子的第0个数据、第二个轮子的第0个数据、第三个轮子的第1个数据 data是当前选中的json数据 如

[{id:’1’,value:’hello’},{id:’2’,value:’world’}]

功能函数:

函数名 参数 描述 

setTitle() string 设置控件的标题 

locatePosition() sliderIndex, posIndex 传入位置数组,重新定位轮子选中的位置 

updateWheel() sliderIndex, data 重新渲染指定的轮子 

updateWheels() data 重新渲染所有轮子(仅限级联数据格式使用)

show() 无参 唤起弹窗组件 

getValue() 无参 获取组件选择的值 

注:功能函数中需要传递的参数含义如下 sliderIndex 代表的是要修改的轮子的索引 posIndex 代表位置索引

相关插件-选择框,其他

酷炫的发光单选框

发光的动态竖直单选框
  选择框
 25238  331

jQuery复选框美化插件labelauty

单选框复选框样式美化
  选择框
 42225  339
  选择框
 43174  335

省市区三级联动

省市区三级联动,代码简洁
  选择框
 43899  387

讨论这个项目(1)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    . 0
    2021/3/13 9:56:16
    怎么把数据显示到页面 点击确定之后页面无改动 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复