一 , 需求: 结束时间 > 开始时间, 不符合的时间段不能选择.
比如我选择开始日期是7月28,那结束的日期将只能从7月28日后面的日期里来选择,省去了我们JS验证结束日期小于开始日期的麻烦。
具体代码如下:
开始日期的input id = "startDate"
结束日期的input id = "endDate"
从:
<input id="startDate" class="Wdate" type="text" onFocus="var endDate=$dp.$('endDate');WdatePicker({onpicked:function(){endDate.focus();},maxDate:'#F{$dp.$D(\'endDate\')}'})"/>
至
<input id="endDate" class="Wdate" type="text" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'startDate\')}'})"/>
以上摘自http://hi.baidu.com/kqogje/item/919f12498b0a220ec01613fc
二,当天以后的时间不能选
<input id="startDate" class="Wdate" type="text" onfocus="WdatePicker({skin:'whyGreen',maxDate:'%y-%M-%d'})"/>
三,当天以前的时间不能选
<input id="startDate" class="Wdate" type="text" onfocus="WdatePicker({skin:'whyGreen',minDate:'%y-%M-%d'})"/>
四,对选取的时间进行格式化
4.1 精确到时分秒
<input id="startDate" type="text" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})"/>
五,开始和结束时间默认最近一周, 最大跨度一个月
默认为当前最近一周,我没有找到my97datepicker有这样的API, 我在页面用java代码实现的, 跨度最大为一个月倒是实现了:
<%
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
GregorianCalendar gc = new GregorianCalendar();
Date currentTime = new Date();
gc.setTime(currentTime);
gc.add(3, -1);
Date date = gc.getTime();//一周前的时间
%>
<input type="text" name="start_time" id="start_time" class="Wdate" value="<%=sdf.format(date).split(" ")[0]+" 00:00:00"%>" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',minDate:'#F{$dp.$D(\'end_time\',{d:-30});}'})"/>
-
<input type="text" name="end_time" id="end_time" class="Wdate" value="<%=sdf.format(currentTime)%>" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',minDate:'#F{$dp.$D(\'start_time\',{d:0});}',maxDate:'#F{$dp.$D(\'start_time\',{d:30});}'})"/>
注意<input>标签的value, 是用jsp中的<%= ....%>直接输出的默认值
- 大小: 17.4 KB
分享到:
相关推荐
3. **获取本月日期**:获取本月的开始日期(月初第一天)和结束日期(月末最后一天)相对简单,只需设置月份为当前月份,日期为1(开始)和0(结束,会自动调整到下月第一天并减去1天): ```javascript function...
My97DatePicker是一款在中国广泛应用的JavaScript日期选择控件,它为网页开发者提供了强大的日期输入功能。这款控件以其丰富的自定义选项、良好的兼容性和用户体验而备受赞誉。在本文中,我们将深入探讨My97...
// 设置结束时间的最小日期为开始日期 endDatePicker.wdate.maxDate = new Date(); // 限制结束时间不能大于当前服务器时间 } }); var endDatePicker = new WdatePicker({ dateFmt: 'yyyy-MM-dd', onclose:...
My97DatePicker提供了日期时间选择的功能,用户可以精确到时分秒进行选择。它通过弹出一个美观的日期选择器,使得用户在网页上输入日期和时间变得更加直观和便捷。插件支持多种日期格式,如yyyy-MM-dd、yyyy/MM/dd...
总的来说,My97DatePicker作为一个强大的JavaScript日期插件,极大地简化了网页日期输入的实现,提高了用户体验,同时也为开发者提供了丰富的定制选项,使得日期控件能够无缝融入到各种类型的项目中。
My97 DatePicker是一款广受欢迎的JavaScript日期时间插件,尤其适用于那些需要在网页中实现日期选择功能的项目。这款控件不仅支持Internet Explorer 8,而且兼容Firefox等现代浏览器,这使得它在跨平台应用上具有较...
My97DatePicker是一款广泛应用于Web开发中的JavaScript时间日期选择插件,它为用户提供了便捷的日期选择界面,极大地提高了用户体验。这款控件以其强大的功能、灵活的配置选项以及良好的兼容性,深受开发者喜爱。 ...
My97DatePicker允许开发者进行深度定制,包括但不限于日期范围限制、是否显示星期、是否开启时间选择、快捷选择项等。例如,设定最小日期和最大日期: ```javascript WdatePicker({ minDate: '-1d', maxDate: '+1...
8. **无障碍访问**:考虑到无障碍访问需求,My97DatePicker还支持键盘导航,用户可以通过上下左右键以及回车键进行日期选择,提高用户体验。 9. **性能优化**:My97DatePicker在设计时注重性能,其轻量级的脚本和...
My97DatePicker是一款广泛应用于网页开发中的JavaScript日期控件,由My97工作室开发,以其易用性、灵活性和强大的功能而备受青睐。这个控件的版本为3.0.1,代表了它在发布时的最新特性集和技术优化。 在JavaScript...
My97DatePicker是一款广泛应用于Web开发中的JavaScript日期选择控件,尤其在中文环境下非常流行。它的版本号4.7.2表明这是一个经过多次迭代优化的成熟产品,旨在为用户提供便捷、美观的日期输入体验。这款控件以其...
3. **日期格式化**:My97DatePicker可以输出多种日期格式,如“YYYY-MM-DD”、“MM/DD/YYYY”等,满足不同的数据存储或展示需求。 4. **日期范围限制**:开发者可以设定日期选择的最小值和最大值,防止用户选择超出...
My97DatePicker目录是一个整体,不可破坏里面的目录结构,也不可对里面的文件改名,可以改目录名 My97DatePicker.htm是必须文件,不可删除 各目录及文件的用途: WdatePicker.js 配置文件,在调用的地方仅需使用该文件 ...
这个示例展示了如何创建两个My97DatePicker输入框,它们的时间格式为“yyyy-MM-dd”,并且开始日期的选择会影响结束日期的最小值,结束日期的选择会影响开始日期的最大值。通过这个例子,开发者可以了解如何在实际...
My97DatePicker是一款非常流行的JavaScript日期控件,它在网页应用中被广泛使用,提供了丰富的日期选择功能,具有良好的用户体验和高度的自定义性。这款控件由my97.net开发,因此得名my97datepicker。在本文中,我们...
My97DatePicker是一款在中国广泛应用的JavaScript日期选择器插件,尤其在Web开发中,它以其强大的功能和良好的用户体验而受到青睐。在这个特定的场景中,我们关注的是如何利用My97DatePicker来实现选择季度的功能。 ...
2. **高度可定制**:MY97DatePicker支持丰富的配置选项,如日期格式、显示样式、语言等,可以根据项目需求进行个性化定制,满足多样化的设计需求。 3. **性能优秀**:MY97DatePicker的代码优化做得相当出色,加载...
4. 功能强大:My97DatePicker支持日期范围限制、日期验证、日期计算(如加减日期)、日期时间的相对表达式(如“今天”、“明天”)等功能。 5. 兼容性好:该控件兼容主流的Web浏览器,包括IE6及以上版本、Firefox...
My97 DatePicker还提供了一些高级特性,如日期计算、日期比较、日期格式化等,使得开发者在处理日期相关的业务逻辑时更加便捷。例如,通过设置`onClose`回调函数,可以获取用户选择的日期并执行相应的处理。 总结来...