angular2+ 引用layDate日期选择插件】的更多相关文章

layDate日期选择插件使用npm安装好像是行不通的,但angular2+的日期选择控件库又不能够支持时分秒的选择 在angular项目中引用layDate 1. 首先官网下载layDate独立版,把laydate文件夹下的文件放入assets文件夹下 2. 在angular-cli.json文件里添加 "styles": [ "assets/theme/default/laydate.css" ], "scripts": [ "as…
上周花了2个小时写的一个日期选择插件,比较适合移动端的设备.先看个效果图吧.如果刚好是你需要的就往下吧,不需要的也可以继续..... 其实网络上已经有的了类似的成熟插件,比如基于mobiscroll,jquery date Entity,第一个已经很成熟了,不过是基于JQM的,可是项目又不能用JQM,退一步想着用第二个吧,找了半天,没找到下载和文档,想想算了,急着用,自己动手吧.. 插件使用,引用CSS和JS.页面代码初始化设置如下: 1 var date1 = new myDateContro…
分享一款贴近用户体验的jQuery日期选择插件.这是一款双日历jQuery日期选择时间插件pickerDateRange.效果图如下: 在线预览   源码下载 var dateRange = new pickerDateRange('date_demo3', { aRecent7Days: 'aRecent7DaysDemo3', //最近7天 isTodayValid: false, //startDate : '2013-04-14', //endDate : '2013-04-21', /…
最近在项目上需要使用日期选择插件,由于是移动端的项目,对请求资源还是蛮节约的,可是百度上一搜,诶~全是基于jquery.zepto的,本来类库就很大,特别像mobiscroll这种样式文件一大堆又丑又长还收费,我就忍不住自己做了一个,也不过就10几kb的事情嘛,想想独乐乐不如众乐乐,如果伙伴们手上没有轻量级的日期选择插件不如先拿我这个应付一下吧! 项目截图: 项目地址:https://github.com/xfhxbb/LCalendar…
将普通的日期选择插件封装成选择到月份的插件:                     var nowMonth = new Date();                    var month = nowMonth.getMonth()+1;                    month = month < 10 ?"0"+month:month;                    var fmdate =nowMonth.getFullYear()+"-&…
1.本次介绍一个好用的 多日期选择插件:EasyUI date,适用于:需要一次性选择多个日期,无需手动一个一个进行添加. 2.效果图: 3.下载地址:http://www.jeasyui.com/download/index.php 4.汉化:建议在使用页面: <script type="text/javascript" src="你的网站绝对地址/locale/easyui-lang-zh_CN.js"></script> 5.使用Dem…
1.My97DatePicker 纯原生JS,专注于PC端,支持IE6+:页面上只需要引入WdatePicker.js文件,但是My97DatePicker整个目录是一个整体,最好不要破坏里面的目录结构,否则就会报错找不到指定文件. (1)直接在html文件中写入 <input id="ipt" type="text" onclick="WdatePicker()" /> 注意:由于此插件是原生JS写的,所以绑定点击事件请务必请用原生…
需求是:在HTML中绘制日历直接供用户选择 而不是使用datepicker之类的表单插件让用户点击input后弹出datepicker让用户选择 浏览了一些解决方案后,发现  CLNDR 这个jQuery插件最漂亮 这名字取得确实晦涩,其实是“calendar”每个相隔字符的拼凑 效果如下: 要想迅速使用,还是比较困难的,文档少,全英文,只有github上一些简单的示例 现在就来总结归纳一下,实现上方这个简单的日历方法.(貌似简单,配置还是很多的) 首先去github上下载最新版本的 CLNDR…
不得不说H5的input date属性真的好用,之前我写的http://www.cnblogs.com/tu-0718/p/6729274.html这篇博客里面也有提到,不过虽然移动端对H5的支持还是很好的,但是PC端浏览器对H5的支持就很让人无奈了.然后最近遇到一个需求:需要一个开始时间和结束时间,默认显示年月,如下图: 第一反应想到的是H5的input date属性,因为兼容性问题无奈放弃,然后发现了一个挺好用的插件:DatePicker, 注:在使用此插件时需要注意,DatePicker插…
Vue中的v-model指令只是一个语法糖,其具体实现是:监听input框的input事件,然后将用户输入的值赋值给input框的value属性 <input type="text" :value="name" v-on:input="name = $event.target.value"> 日期插件的实现是:选择好日期后,将值赋给input框,然而此时并没有绑定到vue的数据中 后来采取的做法是:查询my97的API,找到选择日期的…
My97DatePicker是一个纯js写的时间插件,体积较小,更可以自己扩展皮肤,且样式不和页面相冲突,有多钟配置,近期项目用了一下感觉还不错...分享给大家 软件官网:http://www.my97.net/ 文档演示:http://www.my97.net/dp/demo/index.htm 简介 My97DatePicker目前的版本是:4.8 目录结构: WdatePicker.js   页面引入 calendar.js 主文件,不需引入 目录lang 存放语言文件,你可以根据需要清理…
这个是第二好用的了,支持鼠标滚动选择时间.功能很强大,文档:http://www.dynarch.com/jscal/ 效果图: <!DOCTYPE html PUBLIC           "-//W3C//DTD XHTML 1.0 Transitional//EN"           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html>   <hea…
最简单的应用:http://www.my97.net/dp/demo/resource/2.1.asp…
分享说明: 项目中要使用日期时间范围选择对数据进行筛选;精确到年月日 时分秒;起初,使用了layui的时间日期选择插件;但是在IIE8第一次点击会报设置格式错误;研究了很久没解决,但能确定不是layui的问题;因为自己写的demo可以在IE8运行;只是在我的项目环境下某些代码冲突了;所以换用了bootstrap插件daterangepicker;看了很多资料;结合官网了文档;基本算是搞定了;把我的总结代码分享给大家;希望对使用daterangepicker插件的初学者有帮助. 总结分为四个部分;…
日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式.语言.限制选择日期范围.添加相关按钮以及其它导航等.官方地址:http://docs.jquery.com/UI/Datepicker,官方示例: http://jqueryui.com/demos/datepicker/. 一个不错的地址,用来DIY jQuery UI界面效果的站点http://jqueryui.com/themeroller/ DatePicker基本使用方法: <!DOCTYPE…
最开始使用ui-bootstrap的Datepicker Popup日期选择插件实现双日期选择时间范围时,在网上搜了一些通过JS去实现的方法,不过后来发现可以不必通过JS去处理,只需要使用其自身的属性和参数即可实现,效果如下图(一截图就不显示鼠标的红色圆圈不可选的样式了...尴尬): 这里先附上我觉得简单易懂的JS实现方法,大家可以看看实现的原理: 以下代码就是最开始网上搜索的简单易懂的:http://www.cnblogs.com/tonghaolang/p/5972676.html <!DO…
最开始使用ui-bootstrap的Datepicker Popup日期选择插件实现双日期选择时间范围时,在网上搜了一些通过JS去实现的方法,不过后来发现可以不必通过JS去处理,只需要使用其自身的属性和参数即可实现,效果如下图(一截图就不显示鼠标的红色圆圈不可选的样式了...尴尬): 这里先附上我觉得简单易懂的JS实现方法,大家可以看看实现的原理: 以下代码就是最开始网上搜索的简单易懂的:http://www.cnblogs.com/tonghaolang/p/5972676.html <!DO…
前段时间写了两个移动端的日期选择插件:轻量级移动端日期选择器,本来是为特定的场景中使用的,结果有同学反应不够灵活和强大.虽然我的看法是移动端的界面要尽可能简洁,功能要尽可能简单,但是难免还是会有各种各样的场景,有时候确实需要同时选择年.月.日.时.分.秒,日期的格式要能配置,要能显示“上午 下午”......诸如此类. 所以,一下狠心,索性写个全的吧,之前写的是mdater和mtimer俩兄弟,再来个合体的mdatetimer,意为可以同时选择日期和时间,当然你要只选择日期也是可以配置的.操作方…
接着上一篇纯js移动端日期选择插件,话说今天同事又来咨询省市县联动的效果在移动端中如何实现,还是老样子,百度上一搜,诶~又全是基于jquery.zepto的,更加可恨的是大多数都是PC版的,三个select标签!!!这在移动端上的体验太low了,我想以我的脾气肯定是要自己做的,正好之前做了日期选择,那就依葫芦画瓢自己再做一个吧,来来来,先上效果图: 用法 在html页面中引入input标签,写法如下: <input id="demo1" type="text"…
你是否在开发webapp时,选择用哪种第三方日期选择控件绞尽脑汁? 其实不用那么麻烦,现在移动端都是WebKit内核,支持HTML5,其实只要弱弱的将input中将type="date"就OK了,操作系统会自动识别为日期类型并调用系统自带的日期选择.不用在意日期控件的样式不统一,因为who cares?o(╯□╰)o,大家都是盯着自己的手机,谁选个日期还去比较其他手机呢? 最近看见有个比较牛逼的日期选择插件mobiscroll,网上的口碑特别好,我也下载过来玩了一下,之所以说他牛逼不完…
项目中需要用到日期时间插件,尝试用bootstrap.element的时间插件都各有各的报错,对于一个菜鸟来说真的是很痛苦啊.终于,最后用了layDate实现了需要的功能 最终效果: 使用步骤: 1.下载js包 http://www.layui.com/laydate/ 2.将laydate文件夹放在根目录的static下 3.在index.html中引入 <!DOCTYPE html> <html> <head> <meta charset="utf-…
原文出处 (这是我从互联网上搜来的,感觉能满足各方面的需求.个人感觉挺不错的,所以后期修改了一下向大家推荐!) 效果图: html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org…
8520**ali chengyouli http://www.layui.com/doc/modules/laydate.html实时通信\日期.==插件…
Multiple-Dates-Picker-for-jQuery-UI是一个多日期选择的jquery控件.   GIT源码: https://github.com/dubrox/Multiple-Dates-Picker-for-jQuery-UI 项目简介: http://multidatespickr.sourceforge.net/#option-addDates  这里的例子很丰富,需要什么功能照着做就好了.   示例: <script src="../JS/jquery-ui.m…
1.日期选择 只要将class设置成easyui-datebox就可以了,当然前提是已经应用了easyui的js <input type="text" class="easyui-datebox" id="datetime"> <input type="text" class="easyui-datebox" id="datetime"> 2.时间选择 默认的时间…
她基于原生JavaScript精心雕琢,兼容了包括IE6在内的所有主流浏览器.她具备优雅的内部代码,良好的性能体验,和完善的皮肤体系,并且完全开源,你可以任意获取开发版源代码,一扫某些传统日期控件的封闭与狭隘.layDate本着资源共享的开发者精神和对网页日历交互无穷的追求,延续了layui一贯的简单与易用.她遵循LGPL协议,您可以免费将她用于任何个人项目. 版本 LayDate 1.1 作者:闲心贤 github 在线实例 实例预览 layDate - js日期控件与时间插件演示 实例预览 …
github地址: https://github.com/yuanzm/simple-date-picker#simple-date-picker simple-date-picker 基于zepto的移动端轻量级日期插件 安装 支持下面两种方式 git clone之后直接拷贝引用bin文件夹下面的datepicker.min.css和datepicker.min.js 从npm下载安装:npm install --save date_picker 使用 引用样式datepicker.min.c…
本人后端开发码农一个,公司前端忙的一逼,项目使用的是easyui组件,其自带的datebox组件使用起来非常不爽,主要表现在 1.自定义显示格式很麻烦 2.选择年份和月份用户体验也不好 网上有关于和My97DatePicker结合的例子,但感觉也用的不是很爽. 发现国内的layDate体验非常满意,所以萌生出想把这两个组件组合起来的想法,具体代码如下,本人非前端,所以只是实现了基本功能,大神勿喷哦. easyUI版本:V1.5.2 layDate版本:V5.0 /* 基于laydate日期扩展组…
Jquery Mobiscroll是一个用于触摸设备(Android phones, iPhone, iPad, Galaxy Tab)的日期和时间选择器jQuery插件.以及各种滑动插件 可以让用户很方便的只需要滑动数字既可以选择日期.Mobiscroll作为一款jQuery日期插件可以让用户自定义主题,完全通过CSS文件修改样式 最近开发html5+css3手机APP经常用到的,觉得非常好用,兼容性又好,用户体验又很棒,所以就整理出来分享给大家,还支持设置皮肤.显示方式.日期选择模式.日期格…