时间控件-Jedate

项目中时间用的Jedate，很强大的一款原生JS控件，给大家共同分享。

官网：Jedate官网

使用
下载Jedate，解压后放到代码的js文件下，然后引入js和css即可。

页面样式展示

jsp页面

<!doctype html>
<html lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/><meta name="renderer" content="webkit"><title>群发消息</title><%@ include file="/commons/common.jspf"%><link rel="stylesheet" href="${ctx}/css/jquery.datetimepicker.css"><link rel="stylesheet" href="${ctx}/css/mricode.pagination.css"><link rel="stylesheet" href="${ctx}/js/lib/jedate-6.0.2/skin/jedate.css"><script type="text/javascript" src="${ctx}/js/lib/jquery.datetimepicker.js"></script><script type="text/javascript" src="${ctx}/js/lib/jedate-6.0.2/jquery.jedate.js"></script>
</head>
<body><div class="mt12"><span class="b_label lab_wid1 mt6 fl">发送时间</span><span timeradio="1" class="timeType checkBtn radio mr20 on" data-i="0">立即发送</span><span timeradio="2" class="timeType checkBtn radio" data-i="1">设定时间</span><input type="text" class="inpW  inpWid2 input-timer timer" id="time" placeholder="" name="time"/>
</div><script>var initDate=getInitTimePlugin();//初始化时间插件
/script>
</body>

设置时间控件，可以自由变化皮肤和语言等等其他功能。

/*** 初始化时间日期插件*/
function getInitTimePlugin() {/*** 初始化时间控件* @param timeId   时间id*/unction(timeId) {var dateFormat = "Y-m-d H:m:s";var today = new Date();var mouth = today.getMonth() + 1;var day = today.getDate();var dateTime = new Date().sformat("yyyy-MM-dd");var date = dateTime;timeId = "#" + timeId;$(timeId).jeDate({skinCell: "jedateblue",                      //日期风格样式，默认蓝色format: "YYYY-MM-DD hh:mm:ss",isinitVal: false,                            //是否初始化时间，默认不初始化时间initDate: [{YYYY: today.getFullYear(),MM: today.getMonth() + 1,DD: today.getDate(),hh: "00",mm: "00",ss: "00"}, false],//日期 中文 语言设置language: {                                  //多语言设置name: "cn",month: ["01", "02", "03", "04", "05", "06", "07", "08","09", "10", "11", "12"],weeks: ["日", "一", "二", "三", "四", "五", "六"],times: ["小时", "分钟", "秒数"],titText: "请选择日期时间",clear: "清空",today: "今天",yes: "确定",close: "关闭"}});$(timeId).val(dateTime);}return initDateTimer;
}

刚刚使用，还没遇到什么坑，遇到坑再继续补充。

时间控件-Jedate相关推荐

一款好用的时间控件（时间选择器）-jeDate
一款好用的时间控件(时间选择器)-jeDate 1.引入jedate.js: 2.上代码 1>方法一 <input class="datainp" id="d ...
HTML5超简单的日期时间控件
HTML5超简单的日期时间控件时间都是宝贵的,尤其是开发人员,所以为了节省时间,我直接展示下效果,符合您的要求就采纳,不符合,就不用继续看了! 1.1 日期控件效果: 1.2 时间控件展示: 2.1 ...
bootstrap-datetimepicker时间控件添加清除按钮
本文转自:https://blog.csdn.net/gyysmile/article/details/80226993 其实这位大神写的很好了,为什么我还要在写呢,因为我想写点东西了最近测试部提出 ...
python日历gui_python GUI库图形界面开发之PyQt5日期时间控件QDateTimeEdit详细使用方法与实例...
PyQt5日期时间控件QDateTimeEdit介绍 QDateTimeEdit是一个允许用户编辑日期时间的控件,可以使用键盘上的上下键头按钮来增加或减少日期的时间值,QDateTimeEdit通过s ...
robotframe使用之时间控件
robotframe使用之时间控件正常的页面,时间控件会写在一个iframe里面,所以robotframework找不到对的ID或者xpath等. 要解决这个问题必选先显示iframe. 使用关键字 ...
bootstrap日期时间控件
datetime控件 Bootstrap的日期时间控件,使用非常的简单. 首先,添加日期时间控件的引用 @*datetime控件*@<link href="~/Content/Boot ...
EXC中时间控件的使用
EXC中时间控件的使用第一种:用户可以自主选择时间页面效果: 对应代码:format: 'Y-m-d H:i:s',是时间格式,可以自己选择,Y-m-d H:i:s按照顺序分别对应的是年月日时分秒 ...
vue时间控件美化成IOS样式(移动端)，vux组件datatime添加星期几/周几教程
input的时间控件有三种类型属性 Android IOS type="date" 年+月+日(原生UI样式) 年+月+日(滚轮样式) type="datetime&q ...
给echarts添加筛选时间控件时，控件不显示，并设置数据库无数据时echarts模块显示暂无数据
给echarts模块添加时间控件时,控件无效,经检查发现,控件被画布遮盖了,需要用一个form标签包括时间控件,否则时间控件不生效.另外,如果echarts从后台获取到的数据为空,需要提示暂无信息.这 ...
html日期英文状态显示不出来,html 时间控件插件laydate，显示时分，不显示秒
概述项目中使用到了时间控件,不知为何input-->date无法弹出控件,故使用了js插件laydate.根据项目需求,时间要求精度为分,故隐藏秒控件. 参考网友博客,最终实现如下. 代码 l ...

时间控件-Jedate

时间控件-Jedate相关推荐

最新文章

热门文章