jsp界面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>弹出日历组件演示</title>
<link href="date/jquery-ui-1.8.12.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="date/jquery1-5-2.js"></script>
<script type="text/javascript" src="date/jquery-ui-1.8.7.custom-core.min.js"></script>
<script type="text/javascript" src="date/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="date/jquery.ui.widget.js"></script>
<script type="text/javascript">
$(function() {
$.datepicker.setDefaults($.datepicker.regional['zh-CN']);
$('.datepicker').each(function(i){
$(this).datepicker({
inline: true,
dateFormat: 'yy-mm-dd',
showButtonPanel: false
});
$(this).attr("readOnly","true");
});
});
//日期校验
function checkDate(beginStartDate,beginEndDate) {
if(null==beginStartDate || beginStartDate.length==0) {
return true;
}
if(null==beginEndDate || beginEndDate.length==0){
return true;
}
return beginStartDate<=beginEndDate;
}
function checkformDate() {
//获取页面的时间
var beginStartDate = document.getElementById("start").value;
var beginEndDate= document.getElementById("end").value;
if(!checkDate(beginStartDate,beginEndDate)) {
alert("时间条件:结束日期必须大于开始日期!");
return false;
}
return true;
}
</script>
</head>
<body>
<input type="text" id="start" class="datepicker" readonly="true" /> 至
<input type="text" id="end" class="datepicker" readonly="true" /><br />
<input type="button" onclick="checkformDate()" value="校验" />
</body>
</html>
分享到:
相关推荐
《jQuery日历组件详解》 在网页开发中,日历组件是常见的交互元素,它能够为用户提供方便的日期选择功能,常用于表单输入、事件安排等场景。jQuery日历组件以其简洁的API和强大的自定义能力,成为了开发者们常用的...
**jQuery日历组件详解** jQuery日历组件是前端开发中常用的一种交互元素,它能够帮助用户在网页上方便地选择日期,广泛应用于各种在线预订、时间表管理等场景。本篇将详细介绍jQuery日历组件的基本概念、使用方法、...
首先,我们来看这个jQuery日历插件的基本用法。在HTML页面中,你需要指定一个元素来显示日历,这通常是一个input元素或者div元素。例如,你可以设置一个id为"date-display"的div元素作为目标: ```html ...
4. **Jquery_日历**:这可能是一个基础的jQuery日历组件,可能只提供日期选择,但在某些实现中,开发者可能会扩展它以包含时间选择功能。这种控件通常易于定制,适合那些希望自定义样式和行为的开发者。 5. **...
jQuery UI中的Datepicker日历组件是一款广泛使用的JavaScript插件,它为网页添加了美观、功能丰富的日期选择功能。这个组件是jQuery UI库的一部分,提供了多种样式、语言支持以及可定制的选项,使得开发者能够轻松地...
一个非常牛的jquery做的日历,排班,添加提醒功能一个非常牛的jquery做的日历,排班,添加提醒功能一个非常牛的jquery做的日历,排班,添加提醒功能一个非常牛的jquery做的日历,排班,添加提醒功能一个非常牛的...
然而,这个原生的日期输入控件在样式和功能上可能有所限制,因此开发者通常会使用自定义的日历组件。HTML5的Canvas或者SVG也可以用来创建更复杂的日历图形,提供更丰富的视觉效果。 CSS3则负责日历插件的样式设计,...
**jQuery日历插件详解** 在网页开发中,日历组件常常被用于各种场景,如日期选择、事件安排等。jQuery作为一个轻量级的JavaScript库,提供了丰富的插件供开发者使用,其中包括各种日历插件。本文将详细介绍jQuery...
**jQuery原生代码生产日历组件** 在Web开发中,日历组件是一个常见的需求,它可以帮助用户方便地选择日期,广泛应用于表单填写、事件安排等场景。在本篇文章中,我们将探讨如何使用jQuery来创建一个自定义的日历...
这大大提升了日历组件的实用性。 总结来说,jQuery日历插件Calendar是一个功能强大且易于定制的工具,通过`calender.css`、`index.html`和`calender.js`这三个文件,我们可以了解其工作原理,并根据项目需求进行...
在网页应用中,日历组件经常被用来处理日期相关的操作,如日期选择、事件记录、日程安排等。jQuery日历签到插件是一种方便用户进行日期选择和签到操作的工具,它简化了前端开发中的日期交互过程,提升了用户体验。本...
内含有: jquery.1.1.4.core.zip --jQuery最新核心代码 jquery.calendar.zip --日历组件 jquery.menu.zip --菜单组件 jquery.tablesorter.zip --表格排序组件 jquery.tabs.zip --标签页组件 ...
jQuery日历组件通常提供一个用户友好的界面,用户可以通过点击日历图标打开一个下拉日历来选择日期。日历可能包含不同颜色的标记以区分工作日、周末或者特殊日期。此外,它还支持多种语言,以适应全球用户的使用需求...
通过引入JQuery UI库,我们可以轻松地在网页上添加一个功能丰富的日历组件。 3. **实现日历控件** 要实现JQuery日历控件,首先需要在页面中引入JQuery和JQuery UI的CSS和JS文件。然后,选择一个元素(如文本框或...
**jQuery 最新组件库详解** jQuery 是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互。随着技术的发展,jQuery也不断更新,推出了各种新的组件,为开发者提供了更为丰富的功能和更...
**jQuery日历表格插件详解** 在Web开发中,日历和表格是常见的交互元素,它们用于展示数据、安排事件或进行日期选择。jQuery作为一款轻量级的JavaScript库,提供了丰富的插件来扩展其功能,包括日历表格插件。本篇...
使用了jquery日历插件FullCalendar,使用通过PHP程序调用了MYSQL的数据库,实现HTML静态页在线AJAX新建日程,修改、删除日程序,本集成了中国人的农历,采用了UTF8的编码,根目录里带有SQL数据库,下载后导入你的...
而"JQuery日历代码"通常指的是使用jQuery库来实现的一种交互式日历组件。这种组件常用于网站中展示日期选择器或者日程管理功能。在本案例中,提供的压缩包文件包含了实现这一功能的代码示例。 首先,让我们了解一下...
jQuery日历插件FullCalendar是一款强大的、灵活的、易于定制的日历组件,广泛应用于网页中展示日程安排、会议时间等与日期相关的功能。它提供了丰富的API和多种视图,如日视图、周视图、月视图、Agenda视图等,使得...