`

Js My97DatePicker时间控件

 
阅读更多
1.首先导入主要js:

 <script type="text/javascript" src="date/My97DatePicker/WdatePicker.js"/>


<label style="padding: 3px"><span>开始时间:</span>
<input type="text" id="dd"						onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',minDate:'#F{$dp.$D(\'sdd\',{M:-4});}',maxDate:'#F{$dp.$D(\'sdd\',{d:0});}'})" class="Wdate" />
</label>

<label style="padding: 3px">
<span>结束时间:</span>
<input type="text" id="sdd" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',minDate:'#F{$dp.$D(\'dd\');}',maxDate:'#F{$dp.$D(\'dd\',{M:+4});}'})"
class="Wdate" />					
</label>



效果如下图:





如果需要在开始的时候指定时间则:

$(function() {
    //设置历史时间 
	var date = new Date();
	month = (date.getMonth()+1)<10?'0'+(date.getMonth()+1):date.getDate() ;
	day = date.getDate()<10?'0'+(date.getDate()):date.getDate() ;
	hours = date.getHours()<10?'0'+(date.getHours()):date.getHours() ;
	minutes = date.getMinutes()<10?'0'+(date.getMinutes()):date.getMinutes();
	seconds = date.getSeconds()<10?'0'+(date.getSeconds()):date.getSeconds();
	$("#开始时间id").val(date.getFullYear()+'-'+month+'-'+day+' 00:00:00');
	$("#结束时间id").val(date.getFullYear()+'-'+month+'-'+day+' '+hours+':'+minutes+':'+seconds);
});



2.日期选择没有到时分秒的方式。

<input id="开始时间" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" class="Wdate"/>

<input id="结束时间" onfocus="WdatePicker({minDate:'#F{$dp.$D(\'exestate\')}',dateFmt:'yyyy-MM-dd'})" class="Wdate"/>



效果如下图:








  • 大小: 58.7 KB
  • 大小: 59 KB
  • 大小: 51.5 KB
  • 大小: 53.9 KB
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    My97DatePicker时间控件使用

    在实际使用中,我们通常通过引入My97 DatePicker的JavaScript和CSS文件,然后对特定的输入框进行初始化来启用这个时间控件。以下是一个基本的使用示例: ```html &lt;!DOCTYPE html&gt; &lt;title&gt;My97 DatePicker 示例...

    日期控件My97DatePicker的使用

    My97DatePicker是一款在中国广泛应用的JavaScript日期选择控件,它为网页开发者提供了强大的日期输入功能。这款控件以其丰富的自定义选项、良好的兼容性和用户体验而备受赞誉。在本文中,我们将深入探讨My97...

    My97Datepicker日历控件

    My97Datepicker控件具有良好的浏览器兼容性,支持IE6+及现代浏览器。它的性能优化做得很好,即便在大量数据处理时也能保持流畅。 7. **日期格式化** 除了默认的日期格式外,My97Datepicker还可以支持自定义格式,...

    My97DatePicker时间控件

    My97DatePicker目录是一个整体,不可破坏里面的目录结构,也不可对里面的文件改名,可以改目录名 My97DatePicker.htm是必须文件,不可删除(4.8以后不存在此文件) 各目录及文件的用途: WdatePicker.js 配置文件,在调用的...

    jsp页面使用My97DatePicker日历控件就经常出现无法打开站点

    My97DatePicker是一款广泛使用的JavaScript日期选择插件,它为jsp页面提供了一种方便、美观的日期选取方式。然而,在实际应用中,可能会遇到“无法打开站点”的问题,这可能是由多种原因引起的。以下我们将详细探讨...

    My97DatePicker绿色样式时间控件

    这款绿色样式的时间控件是My97DatePicker的一种皮肤,旨在提供一个友好、直观且美观的日期选择界面。 1. **My97DatePicker介绍** My97DatePicker是由My97公司开发的一款JavaScript日期选择器,它提供了丰富的功能...

    My97DatePicker日历控件

    My97DatePicker是一款广泛应用于Web开发中的JavaScript日历控件,它以其强大的功能、高度的自定义性以及良好的用户体验而受到开发者的喜爱。这款控件能够帮助用户在网页上方便地选择日期,提供了多种显示样式和交互...

    My97DatePicker时间控件详细使用说明

    2. **初始化控件**:通过JavaScript代码调用My97DatePicker的初始化函数,指定要添加时间控件的输入框。 3. **配置选项**:根据需求调整控件的配置选项,如语言、日期格式、默认日期等。 4. **事件绑定**:如果...

    My97DatePicker(几种日历控件/js/实例演示)

    - `My97DatePicker.js`:主JavaScript文件,包含了控件的核心代码。 - `My97DatePicker.css`:样式文件,用于定义日期选择器的外观。 - `demo.html`:实例演示文件,展示了控件的各种用法和功能。 - `lang` 文件夹:...

    My97DatePicker时间控件包和使用

    【My97DatePicker时间控件】是中国程序员杨洪基开发的一款高效、易用、功能强大的日期选择插件,广泛应用于Web开发中。它提供了一种直观、用户友好的方式来输入和选择日期,大大提升了用户体验。这个控件以其灵活性...

    ext JS集成My97DatePicker日期控件

    标题中的“ext JS集成My97DatePicker日期控件”指的是在Web开发中,使用Ext JS框架与My97 DatePicker插件进行集成,以提供用户友好的日期选择功能。Ext JS是一个强大的JavaScript库,用于构建富客户端应用程序,而My...

    My97DatePicker_时间控件

    《My97DatePicker:高效易用的Web时间控件详解》 在网页开发中,时间控件是不可或缺的一部分,它能够提供用户友好的日期选择体验,使得数据输入更加方便快捷。My97 DatePicker是一款广受好评的时间控件,它不仅支持...

    My97DatePicker日期控件

    My97DatePicker是一款广泛应用于网页开发中的JavaScript日期控件,由My97工作室开发,以其易用性、灵活性和强大的功能而备受青睐。这个控件的版本为3.0.1,代表了它在发布时的最新特性集和技术优化。 在JavaScript...

    My97DatePicker控件使用总结

    My97DatePicker是一款在中国广泛应用的时间控件,尤其在Web开发中,它被广泛用来提供用户友好的日期选择功能。这款控件以其强大的功能、自定义的样式和良好的兼容性著称,使得开发者能够轻松地在网页上添加日期选择...

Global site tag (gtag.js) - Google Analytics