`

日期时间段查询功能 截止日期不能小于起止日期

 
阅读更多

实现功能:   日期文本可输入 ,可选择  起始日期不能大于 截止日期

jsp:       js在下面有链接 可以下载。

 <td width="20%" align="center">

<input type="text" id="startTime" onblur="jugue(this)"

name="startTime" size="7" value="${startTime}" class="topInput" />

&nbsp;-&nbsp;

<input type="text" id="endTime" onblur="jugue(this)" size="8"

name="endTime" value="${endTime}" class="topInput" />

</td>

<link type="text/css" href="<%=basePath%>css/date/jquery.ui.all.css" rel="stylesheet" />

<script type="text/javascript"src="<%=basePath%>js/date/jquery-1.5.1.js"></script>

<script type="text/javascript" src="<%=basePath%>js/jquery-1.6.min.js"></script>

<script type="text/javascript"src="<%=basePath%>js/date/ui/jquery.ui.core.js"></script>

<script type="text/javascript"src="<%=basePath%>js/date/ui/jquery.ui.widget.js"></script>

<script type="text/javascript" src="<%=basePath%>js/date/ui/jquery.ui.datepicker.js"></script>

<script type="text/javascript"src="<%=basePath%>js/date/ui/i18n/jquery.ui.datepicker-zh-CN.js"></script>

<script type="text/javascript" src="<%=basePath%>js/date/ui/date.js"></script>

<script type="text/javascript">

    $(function() {

           var dates = $("#startTime,#endTime")

.datepicker(

{

changeYear : true,

changeMonth : true,

numberOfMonths : 1,

onSelect : function(selectedDate) {

var option = this.id == "startTime" ? "minDate": "maxDate", instance = $(this).data(

"datepicker"), date = $.datepicker.parseDate(

instance.settings.dateFormat|| $.datepicker._defaults.dateFormat,selectedDate, instance.settings);

dates.not(this).datepicker("option", option, date);

}

});

     }

 

function isDate(str) {

var r = str.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/);

if (r == null)

return false;

var d = new Date(r[1], r[3] - 1, r[4]);

return (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3] && d

.getDate() == r[4]);

}

function jugue(Element) {

if (Element.value != "") {

if (!isDate(Element.value)) {

alert("日期格式错误,请按照“2002-01-01”重新输入!");

Element.value = "";

Element.focus();

//return false;

}

}

}

</script>

分享到:
评论

相关推荐

    JQuery-bootstrap-datetimepicker开始时间小于等于结束时间-相互约束-清除时间

    为了使开始时间不能大于结束时间,我们在结束时间输入框上同样添加了一个监听事件,在开始时间变化后,我们更新结束时间的最早可选时间。这样可以保证无论用户如何选择,开始时间始终会小于等于结束时间。 在HTML中...

    限定起止日期的jQeruy年月日选择三级联动

    限定起止日期的jQeruy年月日选择三级联动,需求其实很简单,就是让用户填写出生日期的时候选择年月日. 当然可以用bootstrap-datepicker,感觉有点杀鸡用牛刀似的,而且手机选择的时候反而不便捷. 本来就是3个选择菜单...

    ios-DatePicker,年月日起止日期选择.zip

    接下来,项目中强调了日期选择的逻辑,即确保结束日期不能早于开始日期,开始日期也不能晚于结束日期。这通常涉及到监听`DatePicker`的值改变事件,如`valueChanged`,并在接收到新值时进行比较和调整。例如: ```...

    wxapp-timePicker-master日期(起止)选择器组件.zip

    【微信小程序日期(起止)选择器组件】是微信开发者常用的一种UI组件,主要用于实现用户在小程序中选择日期或时间段的功能。此组件通常用于预订、预约等场景,让用户能够方便地设定活动开始与结束时间。在`wxapp-...

    日期多选,连续日期、间断日期快速选择

    - 这种功能允许用户选择不相邻的多个日期,比如安排不同时间的工作任务。不同于连续日期选择,它涉及到更复杂的逻辑处理,需要存储每个独立日期。 - 实现间断日期选择,通常需要提供单独的日期选择按钮或通过多次...

    易语言日期时间框源码.zip

    在数据分析中,易语言日期时间框可以帮助用户指定数据筛选的起止时间,从而更精确地分析特定时间段内的数据变化。 源码中的核心部分可能包括以下几个方面: 1. **事件处理**:易语言中,控件的事件处理是非常重要...

    iOS 弹出式日期起止选择器Demo工程代码

    这个"iOS 弹出式日期起止选择器Demo工程代码"提供了一个解决方案,它结合了datetime picker和popupview来创建一个自定义的日期范围选择控件。这种控件允许用户方便地选择开始日期和结束日期,并且支持多种日期格式。...

    日期维表生成结果,日期对应年、月、对应自然周起止日期等维度

    日期(YYYYMMDD格式)20201229 日期(YYYY-MM-DD格式)2020/12/29 日期(时间戳格式)1609171200 日期对应年(如2018)2020 日期对应月份(如201801)202012 日期对应周号(自然年中的第几周)53 对应自然周日期2 自然周起始日期...

    周月起止时间计算

    在实际项目中,`SKTime`可能是包含此类功能的类或者模块名称,它可能封装了这些日期时间的计算逻辑,方便在项目中复用。通过这样的函数或类,我们可以轻松地根据任何日期获取对应的周和月的起止时间,从而有效地进行...

    Android自定义滚轮式日期(时间)选择控件

    在Android开发中,为了提供用户友好的交互体验,开发者经常需要自定义各种控件,其中滚轮式日期和时间选择控件是一种常见的需求。这种控件通常用于设置事件的日期和时间,比如日历应用、闹钟设定等场景。本文将深入...

    Android日历日期段选择

    在Android开发中,"Android日历日期段选择"是一个常见的需求,特别是在构建涉及到时间范围选择的应用,如预订系统、活动安排或任务管理器等。这个功能允许用户在日历上选取一个起始日期和结束日期,例如从2016年3月2...

    html5 多种日期选择框

    JavaScript中的Date对象是处理日期和时间的核心工具。你可以创建一个新的Date对象,获取当前日期,或者设置特定日期: ```javascript var date = new Date(); // 创建当前日期 var specificDate = new Date("2022",...

    php获取指定日期之间的各个周和月的起止时间

    如strftime()函数用于格式化本地时间/日期,strtotime()函数则用于将任何英文文本日期时间描述解析为Unix时间戳。在本例中,我们还看到了date()函数的使用,它将时间戳格式化为可读的日期格式。 我们来看一下具体是...

    日期控件 日期选择 日期控件 日期选择

    - 范围选择:支持选择日期范围,如旅行的起止日期。 - 禁用日期:可以设置某些日期为不可选,例如节假日或已预订的日子。 - 当前日期高亮:默认选中当前日期,方便用户确认。 - 快捷选择:提供快捷按钮,如...

    javascript实现取的整一年后的时间

    2. **复制日期对象**:为了不改变原始日期对象,创建一个新的日期对象并赋值为当前日期。 3. **调整年份**:通过 `setFullYear` 方法将日期对象的年份增加一年。 4. **调整日期**:为了防止某些月份的最后一天跨越到...

    Mobiscroll_实例两个,主要是如何设置 起止日期,选中后的触发事件

    Mobiscroll是一款强大的移动Web应用程序开发工具,特别适用于创建日期选择器、时间选择器和滑动菜单等交互组件。在本实例中,我们将探讨如何利用Mobiscroll来设置起止日期以及如何处理选中日期后的触发事件。这两个...

    layDate日期 、时间组件(最新版)

    这款组件旨在简化日期和时间的输入操作,为开发者提供了多种选择方式,包括年选择器、年月选择器、日期选择器、时间选择器以及日期时间选择器。这些选择器不仅涵盖了基本的日期和时间选取需求,还支持范围选择,使得...

    C#自定义日期控件

    - 添加日期筛选功能,限制用户只能选择特定范围内的日期。 - 增强可访问性,如支持键盘导航或屏幕阅读器。 - 提供更复杂的日历视图,如周视图或月视图。 - 添加预约或事件标记,让用户看到特定日期上的预定或提醒。 ...

Global site tag (gtag.js) - Google Analytics