骑士PHP人才系统（74CMS）源代码 展示 jquery.date_input.js源代码
- 下载整个 - 类型：.js文件
DateInput = (function($) { // Localise the $ function
function DateInput(el, opts) {
& if (typeof(opts) != &object&) opts = {};
& $.extend(this, DateInput.DEFAULT_OPTS, opts);
& this.input = $(el);
& this.bindMethodsToObj(&show&, &hide&, &hideIfClickOutside&, &keydownHandler&, &selectDate&);
& this.build();
& this.selectDate();
& this.hide();
DateInput.DEFAULT_OPTS = {
& month_names: [&January&, &February&, &March&, &April&, &May&, &June&, &July&, &August&, &September&, &October&, &November&, &December&],
& short_month_names: [&Jan&, &Feb&, &Mar&, &Apr&, &May&, &Jun&, &Jul&, &Aug&, &Sep&, &Oct&, &Nov&, &Dec&],
& short_day_names: [&Sun&, &Mon&, &Tue&, &Wed&, &Thu&, &Fri&, &Sat&],
& start_of_week: 1
DateInput.prototype = {
& build: function() {
& & var monthNav = $('&p class=&month_nav&&' +
& & & '&span class=&button prev& title=&前一月&&&&&/span&' +
& & & ' &span class=&month_name&&&/span& ' +
& & & '&span class=&button next& title=&后一月&&&&&/span&' +
& & & '&/p&');
& & this.monthNameSpan = $(&.month_name&, monthNav);
& & $(&.prev&, monthNav).click(this.bindToObj(function() { this.moveMonthBy(-1); }));
& & $(&.next&, monthNav).click(this.bindToObj(function() { this.moveMonthBy(1); }));
& & var yearNav = $('&p class=&year_nav&&' +
& & & '&span class=&button prev& title=&前一年&&&&&/span&' +
& & & ' &span class=&year_name&&&/span& ' +
& & & '&span class=&button next& title=&后一年&&&&&/span&' +
& & & '&/p&');
& & this.yearNameSpan = $(&.year_name&, yearNav);
& & $(&.prev&, yearNav).click(this.bindToObj(function() { this.moveMonthBy(-12); }));
& & $(&.next&, yearNav).click(this.bindToObj(function() { this.moveMonthBy(12); }));
& & var nav = $('&div class=&nav&&&/div&').append(monthNav, yearNav);
& & var tableShell = &&table&&thead&&tr&&;
& & $(this.adjustDays(this.short_day_names)).each(function() {
& & & tableShell += &&th&& + this + &&/th&&;
& & });
& & tableShell += &&/tr&&/thead&&tbody&&/tbody&&/table&&;
& & this.dateSelector = this.rootLayers = $('&div class=&date_selector&&&/div&').append(nav, tableShell).insertAfter(this.input);
& & if ($.browser.msie && $.browser.version & 7) {
& & & // The ieframe is a hack which works around an IE &= 6 bug where absolutely positioned elements
& & & // appear behind select boxes. Putting an iframe over the top of the select box prevents this.
& & & this.ieframe = $('&iframe class=&date_selector_ieframe& frameborder=&0& src=&#&&&/iframe&').insertBefore(this.dateSelector);
& & & this.rootLayers = this.rootLayers.add(this.ieframe);
& & & // IE 6 only does :hover on A elements
& & & $(&.button&, nav).mouseover(function() { $(this).addClass(&hover&) });
& & & $(&.button&, nav).mouseout(function() { $(this).removeClass(&hover&) });
& & };
& & this.tbody = $(&tbody&, this.dateSelector);
& & this.input.change(this.bindToObj(function() { this.selectDate(); }));
& & this.selectDate();
& selectMonth: function(date) {
& & var newMonth = new Date(date.getFullYear(), date.getMonth(), 1);
& & if (!this.currentMonth || !(this.currentMonth.getFullYear() == newMonth.getFullYear() &&
& & & & & & & & & & & & & & & & this.currentMonth.getMonth() == newMonth.getMonth())) {
& & & // We have moved to a different month and so need to re-draw the table
& & & this.currentMonth = newMonth;
& & & // Work out the range of days we will draw
& & & var rangeStart = this.rangeStart(date), rangeEnd = this.rangeEnd(date);
& & & var numDays = this.daysBetween(rangeStart, rangeEnd);
& & & var dayCells = &&;
& & & // Draw each of the days
& & & for (var i = 0; i &= numDays; i++) {
& & & & var currentDay = new Date(rangeStart.getFullYear(), rangeStart.getMonth(), rangeStart.getDate() + i, 12, 00);
& & & & if (this.isFirstDayOfWeek(currentDay)) dayCells += &&tr&&;
& & & & if (currentDay.getMonth() == date.getMonth()) {
& & & & & dayCells += '&td class=&selectable_day& date=&' + this.dateToString(currentDay) + '&&' + currentDay.getDate() + '&/td&';
& & & & } else {
& & & & & dayCells += '&td class=&unselected_month& date=&' + this.dateToString(currentDay) + '&&' + currentDay.getDate() + '&/td&';
& & & & };
& & & & if (this.isLastDayOfWeek(currentDay)) dayCells += &&/tr&&;
& & & };
& & & this.tbody.empty().append(dayCells);
& & & // Write the month and year in the header
& & & this.monthNameSpan.empty().append(this.monthName(date));
& & & this.yearNameSpan.empty().append(this.currentMonth.getFullYear());
& & & $(&.selectable_day&, this.tbody).click(this.bindToObj(function(event) {
& & & & this.changeInput($(event.target).attr(&date&));
& & & }));
& & & $(&td[date=& + this.dateToString(new Date()) + &]&, this.tbody).addClass(&today&);
& & & $(&td.selectable_day&, this.tbody).mouseover(function() { $(this).addClass(&hover&) });
& & & $(&td.selectable_day&, this.tbody).mouseout(function() { $(this).removeClass(&hover&) });
& & };
& & $('.selected', this.tbody).removeClass(&selected&);
& & $('td[date=' + this.selectedDateString + ']', this.tbody).addClass(&selected&);
& // Select a particular date. If the date is not specified it is read from the input. If no date is
& // found then the current date is selected. The selectMonth() function is responsible for actually
& // selecting a particular date.
& selectDate: function(date) {
& & if (typeof(date) == &undefined&) {
& & & date = this.stringToDate(this.input.val());
& & };
& & if (!date) date = new Date();
& & this.selectedDate = date;
& & this.selectedDateString = this.dateToString(this.selectedDate);
& & this.selectMonth(this.selectedDate);
& // Write a date string to the input and hide. Trigger the change event so we know to update the
& // selectedDate.
& changeInput: function(dateString) {
& & this.input.val(dateString).change();
& & this.hide();
& show: function() {
& & this.rootLayers.css(&display&, &block&);
& & $([window, document.body]).click(this.hideIfClickOutside);
& & this.input.unbind(&focus&, this.show);
& & $(document.body).keydown(this.keydownHandler);
& & this.setPosition();
& hide: function() {
& & this.rootLayers.css(&display&, &none&);
& & $([window, document.body]).unbind(&click&, this.hideIfClickOutside);
& & this.input.focus(this.show);
& & $(document.body).unbind(&keydown&, this.keydownHandler);
& // We should hide the date selector if a click event happens outside of it
& hideIfClickOutside: function(event) {
& & if (event.target != this.input[0] && !this.insideSelector(event)) {
& & & this.hide();
& & };
& // Returns true if the given event occurred inside the date selector
& insideSelector: function(event) {
& & var offset = this.dateSelector.position();
& & offset.right = offset.left + this.dateSelector.outerWidth();
& & offset.bottom = offset.top + this.dateSelector.outerHeight();
& & return event.pageY & offset.bottom &&
& & & & & &event.pageY & offset.top &&
& & & & & &event.pageX & offset.right &&
& & & & & &event.pageX & offset.left;
& // Respond to various different keyboard events
& keydownHandler: function(event) {
& & switch (event.keyCode)
& & {
& & & case 9: // tab
& & & case 27: // esc
& & & & this.hide();
& & & & return;
& & & break;
& & & case 13: // enter
& & & & this.changeInput(this.selectedDateString);
& & & break;
& & & case 33: // page up
& & & & this.moveDateMonthBy(event.ctrlKey ? -12 : -1);
& & & break;
& & & case 34: // page down
& & & & this.moveDateMonthBy(event.ctrlKey ? 12 : 1);
& & & break;
& & & case 38: // up
& & & & this.moveDateBy(-7);
& & & break;
& & & case 40: // down
& & & & this.moveDateBy(7);
& & & break;
& & & case 37: // left
& & & & this.moveDateBy(-1);
& & & break;
& & & case 39: // right
& & & & this.moveDateBy(1);
& & & break;
& & & default:
& & & & return;
& & }
& & event.preventDefault();
& stringToDate: function(string) {
& & var matches;
& & if (matches = string.match(/^(\d{1,2}) ([^\s]+) (\d{4,4})$/)) {
& & & return new Date(matches[3], this.shortMonthNum(matches[2]), matches[1], 12, 00);
& & } else {
& & & return null;
& & };
& dateToString: function(date) {
& & return date.getDate() + & & + this.short_month_names[date.getMonth()] + & & + date.getFullYear();
& setPosition: function() {
& & var offset = this.input.offset();
& & this.rootLayers.css({
& & & top: offset.top + this.input.outerHeight(),
& & & left: offset.left
& & });
& & if (this.ieframe) {
& & & this.ieframe.css({
& & & & width: this.dateSelector.outerWidth(),
& & & & height: this.dateSelector.outerHeight()
& & & });
& & };
& // Move the currently selected date by a particular number of days
& moveDateBy: function(amount) {
& & var newDate = new Date(this.selectedDate.getFullYear(), this.selectedDate.getMonth(), this.selectedDate.getDate() + amount);
& & this.selectDate(newDate);
& // Move the month of the currently selected date by a particular number of months. If we are moving
& // to a month which does not have enough days to represent the current day-of-month, then we
& // default to the last day of the month.
& moveDateMonthBy: function(amount) {
& & var newDate = new Date(this.selectedDate.getFullYear(), this.selectedDate.getMonth() + amount, this.selectedDate.getDate());
& & if (newDate.getMonth() == this.selectedDate.getMonth() + amount + 1) {
& & & // We have moved too far. For instance 31st March + 1 month = 1st May, not 30th April
& & & newDate.setDate(0);
& & };
& & this.selectDate(newDate);
& // Move the currently displayed month by a certain amount. This does *not* move the currently
& // selected date, so we end up viewing a month with no visibly selected date.
& moveMonthBy: function(amount) {
& & var newMonth = new Date(this.currentMonth.getFullYear(), this.currentMonth.getMonth() + amount, this.currentMonth.getDate());
& & this.selectMonth(newMonth);
& monthName: function(date) {
& & return this.month_names[date.getMonth()];
& // A hack to make &this& refer to this object instance when inside the given function
& bindToObj: function(fn) {
& & var self = this;
& & return function() { return fn.apply(self, arguments) };
& // See above
& bindMethodsToObj: function() {
& & for (var i = 0; i & arguments.length; i++) {
& & & this[arguments[i]] = this.bindToObj(this[arguments[i]]);
& & };
& // Finds out the array index of a particular value in that array
& indexFor: function(array, value) {
& & for (var i = 0; i & array.length; i++) {
& & & if (value == array[i]) return i;
& & };
& // Finds the number of a given month name
& monthNum: function(month_name) {
& & return this.indexFor(this.month_names, month_name);
& // Finds the number of a given short month name
& shortMonthNum: function(month_name) {
& & return this.indexFor(this.short_month_names, month_name);
& // Finds the number of a given day name
& shortDayNum: function(day_name) {
& & return this.indexFor(this.short_day_names, day_name);
& // Works out the number of days between two dates
& daysBetween: function(start, end) {
& & start = Date.UTC(start.getFullYear(), start.getMonth(), start.getDate());
& & end = Date.UTC(end.getFullYear(), end.getMonth(), end.getDate());
& & return (end - start) / ;
& changeDayTo: Given a date, move along the date line in the given direction until we reach the
& desired day of week.
& The maths is a bit complex, here's an explanation.
& Think of a continuous repeating number line like:
& .. 5 6 0 1 2 3 4 5 6 0 1 2 3 4 5 6 0 1 ..
& We are essentially trying to find the difference between two numbers
& on the line in one direction (dictated by the sign of direction variable).
& Unfortunately Javascript's modulo operator works such that -5 % 7 = -5,
& instead of -5 % 7 = 2, so we need to only work with the positives.
& To find the difference between 1 and 4, going backwards, we can treat 1
& as (1 + 7) = 8, so the different is |8 - 4| = 4. If we don't cross the
& boundary between 0 and 6, for instance to find the backwards difference
& between 5 and 2, |(5 + 7) - 2| = |12 - 2| = 10. And 10 % 7 = 3.
& Going forwards, to find the difference between 4 and 1, we again treat 1
& as (1 + 7) = 8, and the difference is |4 - 8| = 4. If we don't cross the
& boundary, the difference between 2 and 5 is |2 - (5 + 7)| = |2 - 12| = 10.
& And 10 % 7 = 3.
& Once we have the positive difference in either direction represented as a
& absolute value, we can multiply it by the direction variable to get the difference
& in the desired direction.
& We can condense the two methods into a single equation:
& & backwardsDifference = direction * (|(currentDayNum + 7) - dayOfWeek| % 7)
& & & & & & & & & & & & = direction * (|currentDayNum - dayOfWeek + 7| &% 7)
& & &forwardsDifference = direction * (|currentDayNum - (dayOfWeek + 7)| % 7)
& & & & & & & & & & & & = direction * (|currentDayNum - dayOfWeek - 7| % 7)
& & (The two equations now differ only by the +/- 7)
& & & & & & &difference = direction * (|currentDayNum - dayOfWeek - (direction * 7)| % 7)
& changeDayTo: function(dayOfWeek, date, direction) {
& & var difference = direction * (Math.abs(date.getDay() - dayOfWeek - (direction * 7)) % 7);
& & return new Date(date.getFullYear(), date.getMonth(), date.getDate() + difference);
& // Given a date, return the day at the start of the week *before* this month
& rangeStart: function(date) {
& & return this.changeDayTo(this.start_of_week, new Date(date.getFullYear(), date.getMonth()), -1);
& // Given a date, return the day at the end of the week *after* this month
& rangeEnd: function(date) {
& & return this.changeDayTo((this.start_of_week - 1) % 7, new Date(date.getFullYear(), date.getMonth() + 1, 0), 1);
& // Is the given date the first day of the week?
& isFirstDayOfWeek: function(date) {
& & return date.getDay() == this.start_of_week;
& // Is the given date the last day of the week?
& isLastDayOfWeek: function(date) {
& & return date.getDay() == (this.start_of_week - 1) % 7;
& // Adjust a given array of day names to begin with the configured start-of-week
& adjustDays: function(days) {
& & var newDays = [];
& & for (var i = 0; i & days.length; i++) {
& & & newDays[i] = days[(i + this.start_of_week) % 7];
& & };
& & return newDays;
$.fn.date_input = function(opts) {
& return this.each(function() { new DateInput(this, opts); });
$.date_input = { initialize: function(opts) {
& $(&input.date_input&).date_input(opts);
} };
return DateInput;
})(jQuery); // End localisation of the $ function
jQuery.extend(DateInput.DEFAULT_OPTS, { &month_names: [&一月&, &二月&, &三月&, &四月&, &五月&, &六月&, &七月&, &八月&, &九月&, &十月&, &十一月&, &十二月&], &short_month_names: [&一&, &二&, &三&, &四&, &五&, &六&, &七&, &八&, &九&, &十&, &十一&, &十二&], &short_day_names: [ &日&,&一&, &二&, &三&, &四&, &五&, &六&]});
$.extend(DateInput.DEFAULT_OPTS, {
& stringToDate: function(string) {
& & var matches;
& & if (matches = string.match(/^(\d{4,4})-(\d{2,2})-(\d{2,2})$/)) {
& & & return new Date(matches[1], matches[2] - 1, matches[3]);
& & } else {
& & & return null;
& & };
& dateToString: function(date) {
& & var month = (date.getMonth() + 1).toString();
& & var dom = date.getDate().toString();
& & if (month.length == 1) month = &0& + month;
& & if (dom.length == 1) dom = &0& + dom;
& & return date.getFullYear() + &-& + month + &-& + dom;
});
- 下载整个
相关源码/软件：
- 一套适合学习的小型PHPCMS系统——witcms 机智CMS，界面超简洁，功能伸缩性比较强，可以满...
- UberGallery是一个使用PHP开发的简易相册，不需要数据库。UberGallery的设计基于...
- BEES企业网站管理系统，基于PHP+Mysql，采用模块化开发，MVC设计模式实现了程序与模板完全...
- PHP仿京东商城源码ECShop内核，文件比较大，请耐心下载。同时功能也很强大，用PHP做网上商城的...
- CMSimple一个基于PHP的简易内容管理系统，主要用于小型商业和个人站点的维护，简单灵巧，短小精...
- Chyrp 是一款国外的开源博客引擎，界面和后台英文，将来可能会发布中文语言包。不过虽然是英文，但它...
- 这是一款适用于Discuz! 6.0-7.2的新浪微博同步分享插件，除此之外，Xweibo插件还可帮...
- cool-php-captcha 是一个国外很酷的 PHP 验证码生成库，生成的验证码效果如上所示，...
- Xweibo For Discuz! X2.0是一款为站长提供的Discuz与微博连接的工具，帮助网...
- PHP免费图片上传及外链生成示例，一款免费的PHP图片外链程序，功能十分简单。上传图片后可以生成图片...
- 淡抹夕阳传世模拟,供学习
- dhcp服务器源码
- 暂时没有该资源介绍
- 使用VC开发的模拟Visual&Studio&风格的用户界面
- 是一个简单销售系统&&是纯C语言写的
- 游戏源码之认证服务器，想学习的可以看看，可直接编译
- Advanced&3D&Game&Programming&w...
- 游戏源码之世界服务器主程序，还算不错了。
- 游戏源码之碰撞引擎，有兴趣的可以看看，比较另类。
- 非常有趣的小游戏这篇文章将向你分享一些不为人知的但很有用的JavaScript小建议，对那些刚涉及使用JavaScript编程语言的初级开发者应该有很大的帮助。1. 用数组长度截取数组我们都知道，对象都是通过使用JavaScript引用的，但这...
随着世界的发展互联网被认为是作为互动媒体今天的有效途径之一。当你通过你的意见或消息有互联网是向世界有你。这样做，在今天今天生活的最好办法是打开自己的网站。因为不是每个人都知道如何创建自己的网站，专...
这篇文章基本上是你的最流行和最有效的JavaScript工具包创建图表和图形。我们会给你其实可以为你做什么，这些工具包的概述。如果你是一个开发人员，我相信你有发现自己一次又一次地重复一些老寒。如果发生这种情...
所谓JS库就是预先写好的JS程序库，用于简化以JS为基础的开发程序，尤其是对AJAX和其他以Web为中心技术的JS代码集。JS的首要用途是将编写的功能内嵌在HTML页面，并与页面的对象模型(DOM)进行互动。很多JS库很容易...
最近，我面试了一位具有5年Web应用开发经验的软件开发人员。她有4年半的JavaScript编程经验，自认为自己具有非常优秀的JavaScript技能，可是，随后我很快发现，实际上她对JavaScript却知之甚少。然而，我并不是要...
传统的AJAX轮询方式，客服端以用户定义的时间间隔去服务器上查询最新的数据。种这种拉取数据的方式需要很短的时间间隔才能保证数据的精确度，但太短的时间间隔客服端会对服务器在短时间内发送出多个请求。反转AJ...
盒阴影 box-shadow，在CSS3是这样的：-o-box-shadow: 10px 10px 5px #888;-icab-box-shadow: 10px 10px 5px #888;-khtml-box-shadow: 10px 10px 5px #888;-moz-box-shadow: 10px 10px 5px #888...
这个url的正则表达式判断的JavaScript！比较全面的。它验证的情况包括IP，域名（domain），ftp，二级域名，域名中的文件，域名加上端口！用户名等等信息，貌似作者也是在网上找的，我从一个项目代码中扣出来的，...
类似的布局，似乎一夜之间出现在国内外大大小小的网站上，比如 Pinterest (貌似是最早使用这种布局的网站了)，Mark之，蘑菇街，点点网，以及淘宝最新上线的哇哦 等等。通常，随着页面滚动条向下滚动，这种布局...
我js写的很烂，闲来无事模仿下这个功能，思路大概就是用cookie来纪录每次访问的商品id，只要点击一款商品，cookie中就记住一个，然后ajax去请求服务端根据商品id倒序把数据取回来。&%@ page language=&java& ...
1、横向（纵向）时间轴tab标签切换和水平（垂直）。2、tab标签样式焦点图切换代码。3、多种不同方向风格的tab标签切换效果。4、多层tab标签嵌套支持无连接分类...
jQuery datepicker skins 提供了一组jQuery UI的日期选择器的不同风格/rtsinani/jquery-datepicker-skins
&head&&script type=&text/javascript& src=&/jquery-1.4.4.min.js&&&/script&&script type=&text/javascript&&function selectGroup(checkbox,obj) {$('input[name='+obj+&am
前端时间对公司已有项目JavaScript代码进行优化，本文的是对优化工作的一个总结，拿出来与大家分享。当然我的优化方式可能并不是最优的，或者说有些不对的地方，请指教。JavaScript优化总结分为以下几点优化前后...
题目一：if (!(&a& in window)) {
var a = 1;}alert(a);题目二：var a = 1,
b = function a(x) {
x && a(--x);
};alert(a);题目三：function a(x) {
return x * 2;}var...
jQuery.post( url, [data], [callback], [type] ) ：使用POST方式来进行异步请求参数：url (String) : 发送请求的URL地址.data (Map) : (可选) 要发送给服务器的数据，以 Key/value 的键值对形式...
Parsley，是一款强大的JavaScript表单验证插件，可以帮助你只使用简单的配置即可实现表单验证功能，这完全基于它的强大DOM-API。主要特性：基于超棒的用户体验超级方便配置超轻量级(压缩后12K），支持jQuery和Ze...
JSON是一种轻量级的数据交换格式。它是基于javascript语法标准的一个子集。JSON是一种轻量级的数据交换格式。JSON采用完全独立于语言的文本格式，可以很容易在各种网络、平台和程序之间传输。JSON的语法很简单，...
随着HTML5的发展，越来越多的多媒体相关标准及其实现也随即出现了。如果你没有尝试过使用javascript来生成midi音乐的话，今天介绍的MIDI.js绝对能够让你眼前一亮。MIDI.js是一个基于框架帮助你使用浏览器生成MID...
做网站仍旧充满挑战的地方，前端开发，则是这多方面的事情中的一个重要方面。潜心尝试过的人兴许会有这样的体会，这是一片崭新的世界，无论是理念、技巧，都有一种新鲜的感觉。如果你还没有尝试过，相信我，它会...
Copyright (C) 2007-, All Rights Reserved 版权所有 . 沪ICP备号
地址:上海徐汇区零陵路585号 爱邦大厦26H座
传真(FAX):021-
电话(Tel):021-
PHP100 Website Powered by PHPCMS. For PHP100. 服务器维护：阿里巴巴-阿里云