時間選擇器代碼推薦「js時間選擇器插件有什麼」

序言:mm再也不用擔心我找不到合適好看的日期選擇插件了,今天分享三款純jquery移動端日期時間選擇插件,趕緊點贊收藏轉發吧。

每日分享,三款純jquery移動端日期時間選擇插件

一、jQuery移動端觸屏滑動時間日期選擇插件

簡介:jQuery移動端觸屏滑動時間日期選擇插件,點擊文本框觸發時間選擇控件,默認選擇當前日期,選好的以紅色顯示。

每日分享,三款純jquery移動端日期時間選擇插件

js代碼:

<script> 
   //選擇 YYYY-MM-dd 格式的調用: 
   $.selectYY_MM_DD("#select_0"); 
 
   $('.title').html('選擇起始時間') 
//    $(function () { 
//             var currYear = (new Date()).getFullYear();    
//             var opt={}; 
//             opt.date = {preset : 'date'}; 
//             opt.default = { 
//                 theme: 'android-ics light', //皮膚樣式 
//                 display: 'modal', //顯示方式  
//                 mode: 'scroller', //日期選擇模式 
//                 lang:'zh', 
//                 startYear:currYear-10, //開始年份 
//                 endYear:currYear + 10 //結束年份 
//             }; 
              
//             $("#start_kdsj").val('').scroller($.extend(opt['date'], opt['default'])); 
//             $("#end_kdsj").val('').scroller($.extend(opt['date'], opt['default'])); 
//         }); 
</script> 
<script> 
    $.selectYY_MM_DD("#select_1"); 
 
           var myDate = new Date; 
            var year = myDate.getFullYear(); //獲取當前年 
            var mon = myDate.getMonth() + 1; //獲取當前月 
            var date = myDate.getDate(); //獲取當前日 
            console.log(year,mon,date) 
</script>

二:簡單的jQuery移動端日期時間選擇插件

簡介:一款簡單的jQuery手機移動端日期時間選擇插件,點擊輸入框遮罩彈出日期時間選擇器,手機觸屏滑動分別選擇年、月、日、時、分。

每日分享,三款純jquery移動端日期時間選擇插件

js代碼:

<script type="text/javascript" src="js/jquery.min.js"></script> 
<script type="text/javascript" src="js/jquery.date.js"></script> 
<script type="text/javascript"> 
$.date('#date3'); 
</script>

三:datePicker簡單的手機移動端日期選擇插件

簡介:datePicker是一款非常簡單易用的手機移動端日期選擇插件,點擊輸入框觸發彈出年月日滑動選擇控件。

每日分享,三款純jquery移動端日期時間選擇插件

js代碼:

<script src="datePicker.js"></script> 
    <script> 
    var calendar = new datePicker(); 
calendar.init({ 
    'trigger': '#demo1', /*按鈕選擇器,用於觸發彈出插件*/ 
    'type': 'date',/*模式:date日期;datetime日期時間;time時間;ym年月;*/ 
    'minDate':'1900-1-1',/*最小日期*/ 
    'maxDate':'2100-12-31',/*最大日期*/ 
    'onSubmit':function(){/*確認時觸發事件*/ 
        var theSelectData=calendar.value; 
    }, 
    'onClose':function(){/*取消時觸發事件*/ 
    } 
}); 
     
    </script>

以上是為大家分享的三款純jquery移動端日期時間選擇插件,有需要以上代碼的可以在下方給我留言。

原創文章,作者:投稿專員,如若轉載,請註明出處:https://www.506064.com/zh-hk/n/205374.html

(0)
打賞 微信掃一掃 微信掃一掃 支付寶掃一掃 支付寶掃一掃
投稿專員的頭像投稿專員
上一篇 2024-12-07 17:46
下一篇 2024-12-07 17:46

相關推薦

發表回復

登錄後才能評論