1.没有对控件进行设置
当前位置:首页 > 日记 > 正文

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

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()); });

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

相关文章

AI如何做出凹陷效果 AI制作文字凹

AI如何做出凹陷效果 AI制作文字凹

凹陷,文字,教程,效果,电脑软件,小薰AI教程:使用AI制作相册。本次教程中,通过制作凹陷效果文字的步骤介绍如何使用AI制作凹陷效果;主要使用到外观中的内发光和变换,灵活变换参数数值可以得到不同的效果,在练习中需要多次尝试得到最理想的结果。赶…

什么是网页登录保护及如何取消网页

什么是网页登录保护及如何取消网页

网页,取消,登录,设置,电脑软件,  每个受保护网页都包含有一个设定好的权限代码,在用户登录成功并赋予相应的访问权限后,检查该用户的权限信息是否包含有该网页的权限代码,如果有则可以访问这个受保护网页,否则重定向到登录失败或权限不够…

JavaScript实现短信倒计时60s

JavaScript实现短信倒计时60s

倒计时,短信,电脑软件,JavaScript,废话不多说了,直接给大家贴代码了,具体代码如下所示;$(function(){ //获取验证码 var getCode = document.getElementById('getCode'); var wait = 60; function time(btn){ if (wait===0) …

wps幻灯片怎么设置自动切换

wps幻灯片怎么设置自动切换

步骤,幻灯片,设置自动,演示,电脑软件,  幻灯片放映过程中通常情况下都是点击鼠标才会切换到下一张幻灯片,这时有个问题就是怎么能够让它自动切换呢?下面是WPS演示幻灯片自动切换的方法,希望看完本教程的朋友都能学会wps并运用起来。WPS演示…

PPT演示文稿怎么实现书本式分栏内

PPT演示文稿怎么实现书本式分栏内

书本,演示文稿,内容,电脑软件,PPT,  一般的情况下,ppt的页面内容是由标题和内容的两个虚线框组成,然后用户在里面输入内容,其实我们还可以为演示文稿换另外的一种主题。以下是小编为您带来的关于PPT演示文稿实现书本式分栏内容,希望对您有所…

浅谈jquery拼接字符串效率比较高的

浅谈jquery拼接字符串效率比较高的

方法,拼接字符串,较高,浅谈,效率,实例如下:var roleidArray = new Array("");for(i = 0; i < rightRows.length; i++) { roleidArray.push(rightRows[i].id);}roleidArray = roleidArray.join(",").substring(1);代码很简单,我就不做注…

Vue中的ref作用详解 | 实现DOM的联

Vue中的ref作用详解 | 实现DOM的联

操作,作用,详解,电脑软件,Vue,其实官网已经讲的很仔细了,只是我个人可能接受能力比较差,并没有立刻明白他的意思。不过使用之后就很明白了。这里主要举个例子来说明:我想要的效果是点击保存的同时,也能点击重置这个按钮,触发reset,ref这个特性就…

JavaScript中立即执行函数实例详解

JavaScript中立即执行函数实例详解

立即执行函数,详解,实例,电脑软件,JavaScript,前言js立即执行函数可以让你的函数在创建后立即执行,js立即执行函数模式是一种语法,可以让你的函数在定义后立即被执行,这种模式本质上就是函数表达式(命名的或者匿名的),在创建后立即执行。( func…

ps怎么编辑选区? ps对选区进行基础

ps怎么编辑选区? ps对选区进行基础

方法,基础操作,选区,编辑,电脑软件,ps中想要对选区进行操作,比如移动和反选选区,选区的编辑与应用,选区的调整,该怎么实现呢?下面我们就来看看详细的教程。软件名称:Adobe photoshop 7.01 官方正式简体中文版软件大小:154MB更新时间:2013-04-191、…

Spring 事务隔离与事务传播的详解

Spring 事务隔离与事务传播的详解

事务隔离,详解,事务,电脑软件,Spring,Spring 事务隔离与事务传播的详解与对比Spring是SSH中的管理员,负责管理其它框架,协调各个部分的工作。今天一起学习一下Spring的事务管理。Spring的事务管理分为声明式跟编程式。声明式就是在Spring的配…

Photoshop打造绚丽的烟花字体

Photoshop打造绚丽的烟花字体

字体,绚丽,烟花,电脑软件,Photoshop,利用Photoshop这款强大的图片编辑软件来打造绚丽的烟花字体,来装点你的生活吧。1、打开Photoshop,新建一个800*800大小的文件。背景填充为黑色。2、创建文字图层,本次以&ldquo;新年快乐&rdquo;为例,字体为&l…

Node.js利用断言模块assert进行单

Node.js利用断言模块assert进行单

单元测试,断言,模块,方法,电脑软件,前言对于NodeJS, assert模块提供了一系列的断言测试,其实这个模块主要倾向于内部使用,但是也能被用于项目中, 可以通过require(‘assert')的方式引入,下面本文将给大家介绍关于Node.js用断言模块assert进…

1.没有对控件进行设置