当前位置:首页 > javascript技术文章 > WdatePicker.js时间日期插件的使用方法

小结WdatePicker.js时间日期插件的用法

  • 发布时间:
  • 作者:码农之家原创
  • 点击:86

这篇文章主要知识点是关于js、WdatePicker.js、时间日期插件、的内容,如果大家想对相关知识点有系统深入的学习,可以参阅以下电子书

JavaScript数据可视化编程
  • 类型:js编程大小:61.8 MB格式:PDF作者:Stephen A.Thomas
立即下载

WdatePicker.js时间日期插件的使用方法

本文介绍了WdatePicker.js时间插件使用,分享给大家,具体如下:

引用:

在项目中引用“plugin-clander”文件夹。

在html中引用”WdatePicker.js”即可。

<script src="js/plugin-clander/WdatePicker.js"></script>

1.没有对控件进行设置

<input class="Wdate" type="text" onfocus="WdatePicker()"/>

2.限制日期的范围是 2006-09-10到2008-12-20

 

 

<input id="d411" class="Wdate" type="text" onfocus="WdatePicker({skin:'whyGreen',minDate: '2006-09-10', maxDate: '2008-12-20' })"/>

 

3.限制日期的范围是 2008-3-8 11:30:00 到 2008-3-10 20:59:30

<input type="text" class="Wdate" id="d412" 
onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd HH:mm:ss', 
minDate: '2008-03-08 11:30:00', maxDate: '2008-03-10 20:59:30' })" value="2008-03-09 11:00:00"/>

4.限制日期的范围是 2008年2月 到 2008年10月

 

 
<input type="text" class="Wdate" id="d413" onfocus="WdatePicker({dateFmt: 'yyyy年M月', minDate: '2008-2', maxDate: '2008-10' })"/>

 

5.限制日期的范围是 8:00:00 到 11:30:00

 

 
<input type="text" class="Wdate" id="d414" onfocus="WdatePicker({dateFmt: 'H:mm:ss', minDate: '8:00:00', maxDate: '11:30:00' })"/>

 

6.只能选择今天以前的日期(包括今天)

 

 
<input id="d421" class="Wdate" type="text" onfocus="WdatePicker({skin:'whyGreen',maxDate: '%y-%M-%d' })"/>

 

7.使用了运算表达式 只能选择今天以后的日期(不包括今天)

 

 
<input id="d422" class="Wdate" type="text" onfocus="WdatePicker({minDate: '%y-%M-#{%d+1}' })"/>

 

8. 只能选择本月的日期1号至本月最后一天

 

 
<input id="d423" class="Wdate" type="text" onfocus="WdatePicker({minDate: '%y-%M-01', maxDate: '%y-%M-%ld' })"/>

 

9.只能选择今天7:00:00至明天21:00:00的日期

<input id="d424" class="Wdate" type="text" 
onfocus="WdatePicker({dateFmt:'yyyy-M-d H:mm:ss', 
minDate: '%y-%M-%d 7:00:00', maxDate: '%y-%M-#{%d+1} 21:00:00' })"/> 

10.使用了运算表达式 只能选择 20小时前 至 30小时后 的日期

<input id="d425" class="Wdate" type="text" 
onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm', 
minDate: '%y-%M-%d #{%H-20}:%m:%s' ,maxDate: '%y-%M-%d #{%H+30}:%m:%s' })"/>

11. 前面的日期不能大于后面的日期且两个日期都不能大于 2020-10-01

合同有效期从 到

[注意: 两个日期的日期格式必须相同.

dp. 相当于 document.getElementByIdx_x 函数.

那么为什么里面的 ' 使用 \' 呢? 那是因为 ” 和 ' 都被外围的函数使用了,故使用转义符 \ ,否则会提示JS语法错误.所以您在其他地方使用时注意把 \' 改成 ” 或者 ' 来使用.

#F{$dp.$D(\'d4312\')||\'2020-10-01\'} 表示当 d4312 为空时, 采用 2020-10-01 的值作为最大值]

<input id="d4311" class="Wdate" type="text" onFocus="WdatePicker({maxDate: '#F{$dp.$D(\'d4312\')||\'2020-10-01\'}' })"/> 
<input id="d4312" class="Wdate" type="text" onFocus="WdatePicker({minDate: '#F{$dp.$D(\'d4311\')}' ,maxDate:'2020-10-01' })"/>

WdatePicker.js时间插件的取值和赋值:

引用:

 <script src="js/jquery-2.1.1.min.js"></script>
 <script src="js/plugin-clander/WdatePicker.js"></script>

html:

  <input class="div-Wdate" type="text"  onfocus="WdatePicker()"/>
  <p><button class="tijiaoBtn">提交</button></p>

js:

 //赋值
 $(".div-Wdate").val("2019-01-01");
 //取值
 $(".tijiaoBtn").on("click",function(){
  console.log($(".div-Wdate").val());
 });

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持码农之家。

以上就是本次给大家分享的关于java的全部知识点内容总结,大家还可以在下方相关文章里找到相关文章进一步学习,感谢大家的阅读和支持。

推荐内容

IntelliJ IDEA 注册码(激活到2089年)

idea2020注册激活码(激活到2100年)

实例分析Java实现的zip压缩及解压缩工具类

python3 pandas 如何读取MySQL数据和插入

ThinkPHP3.2.3框架如何实现分页功能

展开 +

收起 -

javascript 相关电子书
学习笔记
网友NO.709269

nodejs判断文件、文件夹是否存在及删除的方法

本文实例讲述了nodejs判断文件、文件夹是否存在及删除的方法。分享给大家供大家参考,具体如下: 判断文件、文件夹是否存在 需要使用nodejs的fs模块 引入 var fs= require("fs") 判断的方法 fs.exists(path, callback) path :判断的文件夹、文件的路径 callback :回调函数 fs.exists("dirName", function(exists) { console.log(exists ? "创建成功" : "创建失败");}); 删除文件夹及文件 node.js的fs模块只提供了删除文件 unlink 夹及目录 rmdir 的功能,所以一起删除需要我们遍历删除,代码如下 var fs = require('fs'); // 引入fs模块function deleteall(path) { var files = []; if(fs.existsSync(path)) { files = fs.readdirSync(path); files.forEach(function(file, index) { var curPath = path + "/" + file; if(fs.statSync(curPath).isDirectory()) { // recurse deleteall(curPath); } else { // delete file fs.unlinkSync(curPath); } }); fs.rmdirSync(path); }}; 使用 deleteall("./dir")//将文件夹……

网友NO.911876

JS开发中基本数据类型具体有哪几种

JS开发中基本数据类型有哪些?JS的数据类型包括基本数据类型、复杂数据类型和特殊数据类型,今天我们主要先讲解一下基本数据类型。 0、先提示两个下面用到的知识点: 0.1typeof,是用来检测变量类型的 写法:typeof a; 0.2console.log()是用来在控制台打印你所需要的部分的 一般浏览器在进入HTML文件页面后,点击右键选择检查,就会出现控制台,选择console就可以看到你所打印的内容了 另外:alert()是页面弹框显示内容 document.write()是输出内容在页面当中的方式 1、变量:在讲基本数据类型之前,我们先来了解一下JS定义变量的方法。 1.1定义变量:在定义一个变量的时候,可以给变量初始值,不区分类型(容器的类型)。 1.2变量的命名规范:字母、数字、下划线和$的组合;不能以数字开头;不能是关键字和保留字; 驼峰命名法。 1.3初始值只能……

网友NO.251534

JS数组扁平化(flat)方法总结详解

需求 :多维数组=一维数组 let ary = [1, [2, [3, [4, 5]]], 6];let str = JSON.stringify(ary); 第0种处理:直接的调用 arr_flat = arr.flat(Infinity); 第一种处理 ary = str.replace(/(\[\]))/g, '').split(','); 第二种处理 str = str.replace(/(\[\]))/g, '');str = '[' + str + ']';ary = JSON.parse(str); 第三种处理:递归处理 let result = [];let fn = function(ary) {for(let i = 0; i ary.length; i++) }{let item = ary[i];if (Array.isArray(ary[i])){fn(item);} else {result.push(item);}}} 第四种处理:用 reduce 实现数组的 flat 方法 function flatten(ary) {return ary.reduce((pre, cur) = {return pre.concat(Array.isArray(cur) ? flatten(cur) : cur);})}let ary = [1, 2, [3, 4], [5, [6, 7]]]console.log(ary.MyFlat(Infinity)) 第五种处理:扩展运算符 while (ary.some(Array.isArray)) {ary = [].concat(...ary);} 这是一个比较实用而且很容易被问到的问题,欢迎大家交流补充。 以上就是本文的全部内容,希望对大家的学习有所帮……

网友NO.228522

JS设计模式之数据访问对象模式的实例讲解

引言 HTML5 提供了两种在客户端存储数据的新方法:localStorage、sessionStorage,他们是Web Storage API 提供的两种存储机制,区别在于前者属于永久性存储,而后者是局限于当前窗口的数据传递,存储在其中的数据会在当前会话结束时被删除。localStorage、sessionStorage的具体内容在这里就不多做介绍了,我们主要探讨一下在实际开发中怎样合理使用他们。 问题 大部分网站会将一些数据(如:用户Token)存储在前端,用来实现页面间的传值,对于一些大型Web应用来说,其存储的数据可能会非常多,数据的管理会变得复杂,并且一个大型项目是由多位程序员共同开发的,这时就会遇到一个问题:怎样确保自己的数据不会覆盖掉其他人的呢?因为在一个页面中大家都是使用同一个WebStorage对象,总不能把大家使用过的Key记录下来吧。这时候就可以使用数据访问对象模式……

<
1
>

电子书 编程教程 文档 软件 源码 视频

Copyright 2018-2020 xz577.com 码农之家

本站所有电子书资源不再提供下载地址,只分享来路

免责声明:网站所有作品均由会员网上搜集共同更新,仅供读者预览及学习交流使用,下载后请24小时内删除

版权投诉 / 书籍推广 / 赞助:QQ:520161757