mobile插件单选与多选的混合

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

 7428  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 代表位置索引

相关插件-选择框,其他

div模拟下拉省市级联三级联动附带地区数据(原创)

带地区代码,兼容到ie8;浏览器样式统一,下拉图标可自行更换,根据隐藏input value值获取地区代码
  选择框
 29822  327

jQuery商品发布三级联动菜单代码

jQuery商品发布三级联动菜单代码是一款点击输入框弹出联动菜单,购物商城或者分类比较多的网站经常用到的产品商品分类选择联动菜单js代码。
  选择框
 39885  408

移动端swiper上下滑动选择

基于swiper实现的移动端上下滑动选择
  选择框
 23866  235

省,市,县三级联动完整版

本插件在多位前辈的基础上经过改良,现已功能齐全,支持编辑 查看功能 支持多款主流浏览器,
  选择框
 63586  468

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

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