多年前自创的一个网页日历控件

现在框架流行,很多常用网页控件都开发好了供人调用,如JQuery的Calendar,美观方便。

多年前我也自己闭门造车弄出个日历控件,再用在哪里已然是不可能,权且当做老照片挂起来,有空凭吊一下。

下载地址在:

http://pan.baidu.com/s/1sjuLD17

下载下来是个JavaWeb工程,放Tomcat里就可以使用的。(为什么要弄个Web工程而不是html包,因为include在html里面不好用。)

日历控件代码和图片都在WebRoot下的calendar目录里。

WebRoot下的Index.jsp展示了加载控件及响应函数的用法。

<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">

    <title>My JSP ‘index.jsp‘ starting page</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
  </head>

  <body>
     <div>Canlendar Show</div>
         <input type="text" id="dateTxt" />&nbsp;<img src="calendar/img/icon.png"onclick="popupCalendar(this,‘dateTxt‘)"/><br/> <!-- onclick后为响应函数 -->
     <button>Submit</button>

     <jsp:include page="calendar/calendar.jsp" flush="true" /> <!-- 加载Calendar控件就这一句 -->
  </body>
</html>

页面使用效果如下:

1.点击日历图标前

2.点击日历图标显示日历

3.选择日期后

《完》

时间: 2024-11-06 17:25:27

多年前自创的一个网页日历控件的相关文章

Jquery自定义扩展方法(二)--HTML日历控件

一.概述 研究了上节的Jquery自定义扩展方法,自己一直想做用jquery写一个小的插件,工作中也用到了用JQuery的日历插件,自己琢磨着去造个轮子--HTML5手机网页日历控件,废话不多说,先看看效果图吧 效果图很简单,代码封装在JQuery中,网页端只需要要调用即可: 二.Jquery自定义实体对象 Jquery可以自定义函数function,有没有可以定义实体对象,里面封装方法那?查询了一下资料发现,是可以的,不仅能够封装属性,还可以写自己的方法,调用模板代码如下: $.Calende

自定义日历控件-CalendarView

转载请注明出处: http://blog.csdn.net/forwardyzk/article/details/43056675 我们在开发中会遇到使用到日历控件,下面就介绍一个自定义日历控件. 思路: 1.自定义类CalendarView继承LinearLayout,使用布局文件,显示布局. 2.使用ViewFlipper,里面添加GridView,当月的日期. 3.使用手势GestureDetector,控制ViewFlipper的滑动. calen_calendar.xml <span

开源日历控件DatePicker源码解析

在一些项目开发中,会使用日历去标识事务,所以根据美工出的效果图,我们可以采用不同的方法去实现.比如通过GridView扣扣你敢.自定义View实现日历控件,这些都是我们解决问题的手段,我也实现过一个自定义日历控件(Android自定义控件之日历控件55993)),由于我只是粗糙的进行实现,并没有进行过多的在控件的可扩展性上进行打磨设计,所以在本篇文章中,我秉着学习的态度分析下爱哥的鼎力巨作DatePicker-DatePicker. DatePicker开源项目地址:[https://githu

撸一个Android高性能日历控件,高仿魅族

Android原生的CalendarView根本无法满足我们日常开发的需要,在开发吾记APP的过程中,我觉得需要来一款高性能且美观简洁的日历控件,觉得魅族的日历风格十分适合,于是打算撸一款. github地址:https://github.com/huanghaibin-dev/CalendarView compile 'com.haibin:calendarview:1.0.2' 先上效果图: 动手之前我们需要分析一下魅族是怎么设计如此高性能的日历的,我们打开开发者选项中的显示布局边界: 好吧

【无私分享】干货!!!一个炫酷的自定义日历控件,摆脱日历时间选择烦恼,纯福利~

最近公司项目中有一个按日期查看信息的功能,楼主本想用之前用的wheelView将就使用的,不过产品经理有个新要求,就是点击按钮弹出的日期选择对话框必须显示农历节假日,周几什么的.这可就难为人了,倘若使用之前的滚动时间选择器,无疑是难以实现的,楼主辗转反侧,冥思苦想,却不得正果. 好吧,去网上下了几个OA系统一用就有了idea,突然想到手机自带的日历~~,oh,year,日历就有这功能,瞧瞧,我靠,这个东西,咋做. 仔细一瞧,似乎用GridView可以实现,额,二话不说就开干.折腾了半天都没弄好,

在iOS上实现一个简单的日历控件

转自:http://blog.csdn.net/jasonblog/article/details/21977481 近期需要写一个交互有点DT的日历控件,具体交互细节这里略过不表. 不过再怎么复杂的控件,也是由基础的零配件组装起来的,这里最基本的就是日历控件. 先上图: 从图中可以看出日历控件就是由一个个小方块组成的,每一行有7个小方块,分别表示一周的星期天到星期六. 给定一个月份,我们首先需要知道这个月有多少周.那么如何确定一个月有多少周呢? 我是这么想的,在NSDate上做扩展: [cpp

个人收藏的必备网页设计控件,也许正是你在寻找的

1.统计图表ECharts ECharts,缩写来自Enterprise Charts,商业级数据图表,一个纯Javascript的图表库,可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器(IE6/7/8/9/10/11,chrome,firefox,Safari等),底层依赖轻量级的Canvas类库ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表.创新的拖拽重计算.数据视图.值域漫游等特性大大增强了用户体验,赋予了用户对数据进行挖掘.整合的能力. 支持折线图(区

利用JS实现Web日历控件(包括日期和时间)

1.由于项目需要,需要一个精确到分钟的日历控件,具体如下图所示. 2.具体包括WebCalendar.js和一个schedule.jsp两个文件,源码如下. (1)WebCalendar.js var cal; var isFocus=false; //是否为焦点 var pickMode ={ "second":1, "minute":2, "hour":3, "day":4, "month":5, &q

Java+Selenium——如何处理日历控件——方法二

有些web产品,网页上有一些时间选择,然后支持按照不同时间段范围去筛选数据.网页上日历控件一般,是一个文本输入框,鼠标点击, 就会弹出日历界面,可以选择具体日期.这篇,就是介绍用selenium如何自动化脚本实现. 先看一个完全模仿手工操作的场景,点击输入框,点击下一个月,再点击一个日子. package rjcs; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Calendar;