宝哥软件园

移动端日期插件Mobiscroll.js使用详解

编辑:宝哥软件园 来源:互联网 时间:2021-09-06

mobiscroll js日期插件的基础入门案例,移动端开发过程中可能会用到。

html head meta charset=' UTF-8 ' title mobiicrol/title link type=' text/CSS ' rel='样式表href='./js/mobiscroll。定制-2。6 .2 .量滴CSS头身!-移动滚动会将表单控件的价值属性与插件的输入值绑定-input id=' date ' name=' date '/br/input id=' time ' name=' time '/br/input type=' button ' value=' show time ' onclick=' show time()'!-一般将射流研究…脚本文件放在身体元素的底部就是为了加快网页的加载,因为网页的加载和脚本的加载是分开的-脚本src='http:/js/jquery-3。1 .0 .js '/script脚本src=' http :/js/mobiscroll。定制-2。6 .2 .量滴js/初始化日期控件/** 日期控件start */var now=new Date();var curryyear=now。getfull year();var curr month=现在。get month()1;var curr day=现在。getdate();//mobiScroll插件选项var opt1={预设: '日期',//日期,可选:日期日期时间时间树_列表图像_文本选择主题:“Android-ics light”,//皮肤样式,可选:默认 Android Android-ics light Android-ics IOs jqm sense-ui WP light WP display : ' modal ',//显示方式,可选:模式内联气泡顶部底部模式:"滚动条",//日期选择模式,可选:scroller 单击pick mixed lang : ' zh ',dateFormat : 'yyyy-mm-dd ',//面板日期格式'设置文本: '确认', //确认按钮名称'取消文本: '取消', //取消按钮名籍我日期顺序: 'yyyymmdd ',//面板中日期排列格式dayText : '日,monthText : '月,yearText : '年', //面板中年月日文字显示现在是:假,现在是:今,endYear: currYear 100,//结束年份minDate:新日期(当前年,当前月- 1,当前日1),在选择:功能时(textVale,inst){ //选中时触发事件console.log('我被选中了.');},onClose:function(textVale,inst){ //插件效果退出时执行inst:表示点击的状态反馈:设置/取消控制台。日志(' TextVale-' TextVale);控制台。日志(这个。id);//这个表示调用该插件的对象}};//时间面板显示日期 $(“# date”).mobiscroll().日期(选择1);//面板显示时间$('#time ').mobiscroll().时间(选择1);函数show time(){ alert($(“# date”).val());}/脚本/正文/html

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

更多资讯
游戏推荐
更多+