首页 > Web开发 > 详细

mobileSelect.js 运用 input 不让吊起小键盘

时间:2019-08-13 20:17:17      阅读:214      评论:0      收藏:0      [点我收藏+]

移动端下拉选择插件  mobileSelect.min.js

 效果:

技术分享图片技术分享图片

点击吊起下方出现选项 可以下拉选择 ,在ios和安卓,因为绑定的元素是input,会出现小键盘(ios会出现),或者input框输入的光标(安卓会出现),尝试将绑定的input添加disabled属性,导致方法不起作用

解决办法:

设置属性  readonly  只读属性即可

(补充这个插件的绑定元素可以是任意元素,但是这里需要有placeholder 提示展示 ,所以 只能用input,会更简单一点)

 

html

 <div class="select-box r">
                    <input type="text" readonly autocomplete="off"   class="layui-input l"  placeholder="请选择证件类型"  id="trigger1" >
                    <input type="hidden"  id="idTypeValue" class="require">
                    <img src="img/select-icon.png" alt="" class="select-icon r">
                </div>

js

 

     var mobileSelect1 = new MobileSelect({
            trigger: ‘#trigger1‘,
            title: ‘证件类型‘,
            wheels: [
                {data: idTypeArr}
            ],
            position:[0,0], //初始化定位 打开时默认选中的哪个 如果不填默认为0
            transitionEnd:function(indexArr, data){
                //console.log(data);
            },
            callback:function(indexArr, data){
                // console.log(data);
                // var index=indexArr[0]
                $(‘#trigger1‘).val(data[0].value)
                $(‘#idTypeValue‘).val(data[0].id)
                isIdCard(data[0].id)
            }
        });

  

 

mobileSelect.js 运用 input 不让吊起小键盘

原文:https://www.cnblogs.com/GoTing/p/11347467.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!