每日分享,三款纯jquery移动端日期时间选择插件

boyanx4个月前技术教程16

序言:mm再也不用担心我找不到合适好看的日期选择插件了,今天分享三款纯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手机移动端日期时间选择插件,点击输入框遮罩弹出日期时间选择器,手机触屏滑动分别选择年、月、日、时、分。

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是一款非常简单易用的手机移动端日期选择插件,点击输入框触发弹出年月日滑动选择控件。

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移动端日期时间选择插件,有需要以上代码的可以在下方给我留言。

我是小程序软件开发,每天分享开发过程中遇到的知识点,如果对你有帮助的话,帮忙点个赞再走呗,非常感谢。

往期文章分享:

程序员搞笑的段子,总有一条戳中你的笑点

微信小程序editor富文本编辑器的使用,拿走不谢

标签: jquery插件

相关文章

jQuery基础回顾——jQuery与Ajax应用

Ajax全称为“Asynchronous JavaScript XML”(异步javaScript和XML),它并不是指一种单一的技术,而是有机地利用了一系列交互式网页应用相关的技术所形成的结合体。A...

JQuery为什么会被淘汰?

前端的同学会发现,除了一些老项目外,现在基本没有新的前端项目使用JQuery了。因此,我们不得不接受一个现实,那就是曾经风光无限的JQuery,即将要被历史淘汰了。为什么那么受人们欢迎的JQuery就...

强大的jQuery移动插件Top 10

随着移动互联网的发展,PC端的网页并不能完全适应移动端的要求,这使得响应式的设计体验成为一种潮流,从而也促成了jQuery Mobile的流行。jQuery Mobile具有良好的扩展性和可自定义性,...

jQuery EasyUI使用教程:为数据网格创建复杂工具栏

jQuery EasyUI最新试用版免费下载>数据网格的工具栏不仅可以包含按钮,还能包含任何其他组件。用户可以通过已存在的div标签轻松定义工具栏布局,该div标签将成为数据网格工具栏的内容。本...

25款开源免费的jQuery工具提示插件

Sweet Tooltip:基于 CSS3 的工具提示插件,提供多种提示风格qTip:强大且精致的jQuery提示信息插件Hint.CSS:采用SASS构建的纯CSS工具提示库,无需 JavaScri...

Jquery高级编程

在过去几年中,JavaScript 发生了翻天覆地的变化。它曾经是一种处于次要地位的“玩具”语言,但是现在JavaScript已经成为世界上最重要的程序设计语言之一。随着基于Ajax的开发的重要性不断...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。