移動端html5 時間選擇控件(相似ios滾輪方式)

mobiscroll:javascript

js和css文件下載地址:css

https://pan.baidu.com/s/1eSx8NXC

 示例代碼java

<script type="text/javascript">
$(function(){
	$('.topicDateTime').mobiscroll().datetime({
        theme: "android-holo-light",     // Specify theme like: theme: 'ios' or omit setting to use default 
        mode: "scroller",       // Specify scroller mode like: mode: 'mixed' or omit setting to use default 
        display: "bottom", // Specify display mode like: display: 'bottom' or omit setting to use default 
        lang: "zh",       // Specify language like: lang: 'pl' or omit setting to use default
        minDate: new Date(),  // More info about minDate: http://docs.mobiscroll.com/2-16-1/datetime#!opt-minDate
        maxDate: new Date(new Date().setMonth(new Date().getMonth() + 6)),   // More info about maxDate: http://docs.mobiscroll.com/2-16-1/datetime#!opt-maxDate
        dateFormat:"yy-mm-dd",
        timeFormat:"HH:ii",
        stepMinute: 1  // More info about stepMinute: http://docs.mobiscroll.com/2-16-1/datetime#!opt-stepMinute
    });
})
</script>

tinyScroll.js:android

github地址:https://github.com/602884291/tinyscroll.jsios

代碼示例:git

var ts;
if (!ts) {
    // init `ts`
    ts = new TinyScroll({
        wrapper: '#container',
        needLabel: true,
        range: ['2010/03/09 12:30:00', '2015/01/01 23:00:00'],
        time: true,
        initDate: '2011/07/20 18:30:00',
        cancelValue: '取消',
        okValue: '肯定',
        okCallback: function(date) {
            alert(date);
        }
    });
} else {
    // if the `ts` is defined
    ts.showScroller();
}
相關文章
相關標籤/搜索