用JavaScript实现的日历

用JavaScript实现的日历
calendar.css:
.cal {
background-color: #ffffff;
}

.head {
color: #bb0000;
font-family: Arial;
font-weight: bold;
text-align: left;
}

.days {
color: #0000bb;
font-family: Arial;
font-weight: bold;
text-align: right;
}

.grey {
color: #ffffff;
font-family: Arial;
font-size: small;
text-align: right;
}

.links {
color: #ff0000;
font-family: Arial;
font-size: small;
text-align: right;
}

.today {
color: #ffffff;
background-color: #ff0000;
font-family: Arial;
font-size: small;
text-align: right;
}

calendar.js:
'January','February','March',
'April','May','June','July',
'August','September','October',
'November','December'
);

var daysOfMonth = new Array(
31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31
);

var daysOfMonthLY = new Array(
31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31
);

var dow = new Array('Sun','Mon','Tue','Wed','Thu','Fri','Sat',
'Sun','Mon','Tue','Wed','Thu','Fri');

var size = 'width="50" height="30"';
var border = 'border="1"';

function isLeapYear(num) {
if (((num % 4 == 0) && (num % 100 != 0)) || (num % 400 == 0))
return true;
return false;
}

function CalendarSelect(Month,Year, offset) {
if (offset == null) offset = 0;

if (window.changeMonth) { }
else {
alert('A changeMonth() function has not been defined');
return '';
}

if (window.changeYear) { }
else {
alert('A changeYear() function has not been defined');
return '';
}

if (window.changeDay) { }
else {
alert('A changeDay() function has not been defined');
return '';
}

var output = '';

output += '

';
output += CalendarHead(Month,Year,true);
output += CalendarMonth(Month,Year,offset);
output += '

';

return output;
}

function CalendarHead(Month,Year,Select) {
var output = '';

output +=
'' +
'';

if (Select) {

output += '

' + moy[Month-1] + ' ' + Year + '

' + ''; for (var month=1; month<=12; month++) { output += 'if (month == Month) output += ' selected'; output += '>' + moy[month-1] + ''; } output += '' + ''; for (var year=1900; year<=2100; year++) { output += 'if (year == Year) output += ' selected'; output += '>' + year + ''; } output += ''; } output += '

';

return output;
}

function CalendarMonth(M,Y,offset) {
M--;
if (offset == null) offset = 0;

firstDay = new Date(Y,M,1);
startDay = firstDay.getDay();

if (startDay < offset) startDay += 7;

var days = daysOfMonth;
if (isLeapYear(Y)) days = daysOfMonthLY;

var output = '';

output +=

'

';

for (var i=0; i<7; i++)
output += '';

output += '';

var column = 0;
var lastM = M - 1;
if (lastM == -1) lastM = 11;

for (var i=0+offset; ioutput += '';

for (var i=1; i<=days[M]; i++, column++) {
var style = ' class="links"';
if (day == i && month == M+1 && year == Y)
style = ' class="today"';
if (window.changeDay)
output += '';
else
output += '';

if (column == 6) {
output += '';
column = -1;
}
}

if (column > 0) {
for (var i=1; column<7; i++, column++)
output += '';
}

output += '

' + dow[i + offset] + '
' + (days[lastM]-startDay+i+1) + '	' + 'style + '>' + i + '	' + i + '
' + i + '

';

return output;
}

function getAnOptionValue(what) {
return what.options[what.options.selectedIndex].value;
}

function CalMonth() {
CalendarMonth = getAnOptionValue(document.Cal.Month) - 0;
changeMonth(CalendarMonth);
}

function CalYear() {
CalendarYear = getAnOptionValue(document.Cal.Year) - 0;
changeYear(CalendarYear);
}

function CalDay(day,month,year) {
CalendarDay = day;
CalendarMonth = month;
CalendarYear = year;
changeDay(CalendarDay,CalendarMonth,CalendarYear);
}

var CalendarMonth;
var CalendarYear;
var CalendarDay;


current.js:
function getFullYear() {
var year = this.getYear();
if (year < 1000) year += 1900;
return year;
}

if (!Date.getFullYear)
Date.prototype.getFullYear = getFullYear;

function getMilliseconds() {
var date = new Date(
this.getFullYear(), this.getMonth(), this.getDate(),
this.getHours(), this.getMinutes(), this.getSeconds(), 0
);
return this.getTime() - date.getTime();
}

if (!Date.getMilliseconds)
Date.prototype.getMilliseconds = getMilliseconds;

var daysOfWeek = new Array(
'Sunday','Monday','Tuesday','Wednesday',
'Thursday','Friday','Saturday'
);

var monthsOfYear = new Array(
'January','February','March','April','May','June',
'July','August','September','October','November','December'
);

function y2k(number) {
number = number - 0;
return (number < 1000) ? number + 1900 : number;
}

function dayOfWeek(day,month,year) {
var a = Math.floor((14 - month)/12);
var y = year - a;
var m = month + 12*a - 2;
var d = (day + y + Math.floor(y/4) - Math.floor(y/100) +
Math.floor(y/400) + Math.floor((31*m)/12)) % 7;
return d;
}

function nths(day) {
if (day == 1 || day == 21 || day == 31) return 'st';
if (day == 2 || day == 22) return 'nd';
if (day == 3 || day == 23) return 'rd';
return 'th';
}

function formatFullDate(day,month,year) {
var dow = dayOfWeek(day,month,year);
return daysOfWeek[dow] + ' ' +

day + nths(day) + ' ' +
monthsOfYear[month-1] +' '+ year;
}

function padout(num) {
return (num < 10) ? '0' + num : num;
}

function formatShortDate(day,month,year) {
return padout(day) + '/' + padout(month) + '/' + year;
}

function formatShortDateUS(day,month,year) {
return padout(month) + '/' + padout(day) + '/' + year;
}


index.htm:

把这四个文件放在同一目录下。运行index.htm

Posted by kevinwu 10:16 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

javaScript小日历

选择日期：

BLOG:/AppleBBS

Posted by kevinwu 10:14 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

一个JavaScript的日历

3 年 月 4

Posted by kevinwu 10:12 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

javascript实现日历式日期选择

Posted by kevinwu 10:11 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

November 25, 2006
用JavaScript实现UrlEncode和UrlDecode
1、







2、

function urlencode(str)
tmp=""
strSpecial="_-.1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ"
for i=1 to len(str)
crt=mid(str,i,1)
if instr(1,strSpecial,crt,1) then
tmp=tmp&crt
else
hexc=hex(asc(crt))
tmp=tmp&"%"& mid(hexc,1,2)
if len(hexc)>2 then
tmp=tmp&"%"& mid(hexc,3,2)
end if
end if
next
urlencode=tmp
end function


3、



Posted by kevinwu 11:52 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

通过时间校验学习JavaScript正则表达式
为什么要从时间验证的例子开始我们的正则表达之旅呢？首先，因为时间校验比较常用，尤其是日期的验证几乎是每个注册程序都要进行校验的；另外，日期函数相 对来说包含的涉及正则表达式

的内容较少，其次字符单一除了数字之外，就是几个很有限的连接连接符号，正则逻辑简单。


预备知识：
1.为JavaScript增加函数：熟悉Java的人都是知道，Java所有的方法都是封装在类中的，那么JavaScript实际上类似（注意：我并 没有讨论JavaScript和Java的相关性，只是说道他们的相似性）；JavaScript中所有的字符串操作实际上都是在String这个类中， 那么我们要为字符串增加一个日期校验的函数应该来怎么做呢？
类名.prototype.方法名 = function (){
/*语句块*/
}
比如我们为字符创类增加一个日期校验的方法IsDate：
String.prototype.IsDate=function(){
}
那么问题来了，这个字符串本身用什么来代表呢？数字面向对象的朋友很快就会想到this，对了就是它；


2.正则表达式的基本知识：
/ 标识正则表达式的开始位置和基础位置
^ 表示字符串的开始位置
$ 表示字符串的结束位置
| 或者
- 描述该字符串的是由（-）左右连个字符之间的所有字符构成
{n,m}有n到m个字符串组成

下面我们就开始日期校验函数的编写
首先我们分析一个完整日期的构成，比如2005-9-13
?年份是后4位数字构成
?月份是由1-12的数字构成
?日期是由1-31的数字构成
?年份可以被四整除为闰年
?2月的闰年为29天，否则为28天
?1、3、5、7、8、10、12每个月的为31天
?4、6、9、11每个月为30天
?如果日期或月份为各位数，那么十位也可以加上0

以上为我们分析的结果，那么根据我们的分析，我们先来构造自己的算法或者说方法。}

年份：能被四整除的了，那么能被4整除的数字都什么特征呢？这是个数学问题了，如果你想不出来，可以再去翻一翻小学的数学书。这里我可以个告诉你以为十位 数为0、2、4、6、8个位为0、4、8以及十位是1、3、5、7、9各位是26可以被四整除。前两位是由0到9的两位数字组成[0-9]{2},后两位 闰年[02468][048]或者是[13579][26]，完整闰年就是将这些都连起来([0-9]{2}([02468][048])|([13579][26]))那么非闰年呢？所有不能被4整除的就是，也就是把闰年的后两位反过来

月份：接下来我们来从最特殊的入手，也就是2月，而其他的月份则与是否闰年无关先来看一下闰年的2月；2月的写法可以使2也可以是02，在正则里应该是[0]{0，1}[2]或者你也可以(2|02)；还有大月(([0]{0,1}(1|3|5|7|8))|(10|12)、小月(([0]{0,1}(4|6))|11)

日期：2月闰年是1到29天，非闰年是1到28天，从正则来考虑，十位是0到2，各位是0到8或0到9组成,闰年：([0][1-9])|([1-2][0-9]，非闰年([0][1-9])|([1][0-9])|(

[2][0-8])，大月([0][1-9])|([1-2][0-9])|30|31小月([0][1-9])|([1-2][0-9])|30

至此，我们的零部件已经制作完成，接下就是我们的组装过程，完整日期的合法性是怎么样子的呢？
闰年-2月-闰2月的的日期
或者
非闰年-2月-非闰2月的的日期
或者
年份-大月-大月日期
或者
年份-小月-小月日期

润2月完整日期：(([0-9]{2}([02468][048])|([13579][26])))(-)(2|02)(-)(([0][1-9])|([1-2][0-9]))
非润2月完整日期：(([0-9]{2}([02468][123579])|([13579][01345789])))(-)(2|02)(-)(([0][1-9])|([1][0-9])([2][0-8]))
大月完整日期：([0-9]{4})(-)((([0]{0,1}(1|3|5|7|8))|(10|12))(-)(([0][1-9])|([1-2][0-9])|30|31)
小月完整日期：([0-9]{4})(-)((([0]{0,1}(4|6))|11))(-)(([0][1-9])|([1-2][0-9])|30)

到这里我们的日期校验函数基本算是完工了，唯一要做的就是收尾工作了，把四个完整日期正则用|（或者）连起来，并且把它写到我们为String新增的函数中就算完工了：
String.prototype.IsDate=function(){
var regexp = /^((([0-9]{2}([02468][048])|([13579][26])))(-)(2|02)(-)(([0][1-9])|([1-2][0-9])))|((([0-9]{2}([02468][123579])|([13579][01345789])))(-)(2|02)(-)(([0][1-9])|([1][0-9])([2][0-8])))|(([0-9]{4})(-)((([0]{0,1}(1|3|5|7|8))|(10|12))(-)(([0][1-9])|([1-2][0-9])|30|31))|(([0-9]{4})(-)((([0]{0,1}(4|6))|11))(-)(([0][1-9])|([1-2][0-9])|30))$/g;
return regexp.test(this);
}
从现在开始我们就是这样来判断一个字符串是否为一个合法的日期了：
var strDate ="2005-2-29";
if(strDate.IsDate())
alert("这是一个正确的日期格式");
else
alert("日期格式错误");


Posted by kevinwu 11:51 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

js二级下拉列表

关键词：
栏　目：
字　段：

Posted by kevinwu 11:51 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

超爽无限级下拉列表
if($_SERVER['REQUEST_METHOD']=='POST'){
print_r($_POST);
}
?>

Posted by kevinwu 11:40 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

如何禁止在文本框中输入中文
具体步骤：

方法一：用文本框的CSS属性ime-mode实现。



提示：设置ime-mode为disabled的意思是禁止在输入时禁止用户激活输入中文，韩文，日文等的输入法（IME）状态，因为这个只能检测到键盘的输入，对通过鼠标操作的粘贴和拖放无效。

方法二：在松开按键时用脚本检查文本框的值，只保留Unicode编码在0和255之间的字符。





方法三：把所有双字节字符替换为空。



方法四：把中文字符替换为空。



特别提示
本例代码运行后，第一种方法是不能切换输入法，所以无法输入中文，其它三种方

法是在输入中文后立即被替换为空，同时禁止了粘贴和拖放事件。



特别说明


本例主要是css属性ime-mode和对中文或双字节字符的判断应用。
ime-mode 设置输入方法编辑器(IME)的状态。
charCodeAt返回指定位置上字符的 Unicode 编码值。

Posted by kevinwu 11:25 AM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

November 23, 2006
滑动展开/收缩广告代码实例效果
功能说明:
滑动展开/收缩广告效果,可指定：广告完全展开时的停留时间，最大高度

兼容浏览器：
IE5.0+、FF1.06+、Opera8.0+

实例代码：

• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容


• 这里是广告内内容

代码实例：滑动展开/收缩广告   请刷新页面，再次观看演示效果

继续阅读 "滑动展开/收缩广告代码实例效果" ?

Posted by k

evinwu 07:13 PM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

November 10, 2006
在查询页面中显示进度条，在数据load成功后隐去进度条

正在处理数据, 请稍候...... id="progress5">

点击按钮试试：



Posted by kevinwu 02:43 PM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

November 02, 2006
JS
Validator = {
Require : /.+/,
Email : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
Phone : /^((\(\d{3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}$/,
Mobile : /^((\(\d{3}\))|(\d{3}\-))?13\d{9}$/,
Url : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,
IdCard : /^\d{18}(\d{2}[A-Za-z0-9])?$/,
Currency : /^\d+(\.\d+)?$/,
Number : /^\d+$/,
Zip : /^[1-9]\d{5}$/,
QQ : /^[1-9]\d{4,8}$/,
Integer : /^[-\+]?\d+$/,
Double : /^[-\+]?\d+(\.\d+)?$/,
English : /^[A-Za-z]+$/,
Chinese : /^[\u0391-\uFFE5]+$/,
UnSafe : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\(\)\[\]\{\}<>\?\\\/\'\"]*)|.{0,5})$|\s/,
IsSafe : function(str){return !this.UnSafe.test(str);},
SafeString : "this.IsSafe(value)",
Limit : "this.limit(value.length,getAttribute('min'), getAttribute('max'))",
LimitB : "this.limit(this.LenB(value), getAttribute('min'), getAttribute('max'))",
Date : "this.IsDate(value, getAttribute('min'), getAttribute('format'))",
Repeat : "value == document.getElementsByName(getAttribute('to'))[0].value",
Range : "getAttribute('min') < value && value < getAttribute('max')",
Compare : "pare(value,getAttribute('operator'),getAttribute('to'))",
Comparetonow : "paretonow(value)",
Compareto : "pareto(value,getAttribute('operator'),document.getElementsByName(getAttribute('to'))[0].value)",
Custom : "this.Exec(value, getAttribute('regexp'))",
Group : "this.MustChecked(getAttribute('name'), getAttribute('min'), getAttribute('max'))",
ErrorItem : [document.forms[0]],
ErrorMessage : ["以下原因导致提交失败：\t\t\t\t"],
Validate : function(theForm, mode){
var obj = theForm || event.srcElement;
var count = obj.elements.length;
this.ErrorMessage.length = 1;
this.ErrorItem.length = 1;
this.ErrorItem[0] = obj;
for(var i=0;iwith(obj.elements[i]){
var _dataType = getAttribute("dataType");
if(typeof(_dataType) == "object" || typeof(this[_dataType]) == "undefined") continue;
this.ClearState(obj.elements[i]);
if(getAttribute("require") == "false" && value == "") continue;
switch(_dataType){
case "Date" :
case "Repeat" :
case "Range" :
case "Compare" :
case "Compareto":
case "Comparetonow":
case "Custom" :
case "Group"

:
case "Limit" :
case "LimitB" :
case "SafeString" :
if(!eval(this[_dataType])) {
this.AddError(i, getAttribute("msg"));
}
break;
default :
if(!this[_dataType].test(value)){
this.AddError(i, getAttribute("msg"));
}
break;
}
}
}
if(this.ErrorMessage.length > 1){
mode = mode || 1;
var errCount = this.ErrorItem.length;
switch(mode){
case 2 :
for(var i=1;ithis.ErrorItem[i].style.color = "red";
case 1 :
alert(this.ErrorMessage.join("\n"));
this.ErrorItem[1].focus();
break;
case 3 :
for(var i=1;itry{
var span = document.createElement("SPAN");
span.id = "__ErrorMessagePanel";
span.style.color = "red";
this.ErrorItem[i].parentNode.appendChild(span);
span.innerHTML = this.ErrorMessage[i].replace(/\d+:/,"*");
}
catch(e){alert(e.description);}
}
var fla = 0;
for(var i=1;iif(this.ErrorItem[i].getAttribute("type")!="hidden"){
this.ErrorItem[i].focus();
fla = 1;
break;
}
}
if(fla==0) alert("请检查必添项！");

break;
default :
alert(this.ErrorMessage.join("\n"));
break;
}
return false;
}
return true;
},
limit : function(len,min, max){
min = min || 0;
max = max || Number.MAX_VALUE;
return min <= len && len <= max;
},
LenB : function(str){
return str.replace(/[^\x00-\xff]/g,"**").length;
},
ClearState : function(elem){
with(elem){
if(style.color == "red")
style.color = "";
var lastNode = parentNode.childNodes[parentNode.childNodes.length-1];
if(lastNode.id == "__ErrorMessagePanel")
parentNode.removeChild(lastNode);
}
},
AddError : function(index, str){
this.ErrorItem[this.ErrorItem.length] = this.ErrorItem[0].elements[index];
this.ErrorMessage[this.ErrorMessage.length] = this.ErrorMessage.length + ":" + str;
},
Exec : function(op, reg){
return new RegExp(reg,"g").test(op);
},
compare : function(op1,operator){
var now=date();
switch (operator) {
case "NotEqual":
return (op1 != now);
case "GreaterThan":
return (op1 > now);
case "GreaterThanEqual":
return (op1 >= now);
case "LessThan":
return (op1 < now);
case "LessThanEqual":
return (op1 <= now);
default:
return (op1 == now);
}
},
compareto : function(op1,operator,op2){
switch (operator) {
case "NotEqual":
return (op1 != op2);
case "GreaterThan":
return (op1 > op2);
case "GreaterThanEqual":
return (op1 >= op2);
case "LessThan":
return (op1 < op2);
case "LessThanEqual":
return (op1 <= op2);
defau

lt:
return (op1 == op2);
}
},
comparetonow : function(op1){
var now=(new java.util.Date());
return (op1 > now);
},
MustChecked : function(name, min, max){
var groups = document.getElementsByName(name);
var hasChecked = 0;
min = min || 1;
max = max || groups.length;
for(var i=groups.length-1;i>=0;i--)
if(groups[i].checked) hasChecked++;
return min <= hasChecked && hasChecked <= max;
},
IsDate : function(op, formatString){
formatString = formatString || "ymd";
var m, year, month, day;
switch(formatString){
case "ymd" :
m = op.match(new RegExp("^((\\d{4})|(\\d{2}))([-./])(\\d{1,2})\\4(\\d{1,2})$"));
if(m == null ) return false;
day = m[6];
month = m[5]--;
year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));
break;
case "dmy" :
m = op.match(new RegExp("^(\\d{1,2})([-./])(\\d{1,2})\\2((\\d{4})|(\\d{2}))$"));
if(m == null ) return false;
day = m[1];
month = m[3]--;
year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));
break;
default :
break;
}
if(!parseInt(month)) return false;
month = month==12 ?0:month;
var date = new Date(year, month, day);
return (typeof(date) == "object" && year == date.getFullYear() && month == date.getMonth() && day == date.getDate());
function GetFullYear(y){return ((y<30 ? "20" : "19") + y)|0;}
}
}
Posted by kevinwu 03:22 PM | 全文 | 评论 (0) | 引用 (0) | JAVASCRIPT(39)

September 06, 2006
javascript常用日期验证
1、


2、
//component 为要检测的表单的id
function checkDateFormat(component){
strDate = component.value;
//"-",".","/","\"
var reg = /[-|\\|\.|\/|\s]/g;
strDate = strDate.replace(reg, "-");
//"dddd-dd-dd"
var regDate = /^(\d{1,4})(-)(\d{1,2})\2(\d{1,2})$/;
var result = strDate.match(regDate);
if ( result == null ){
return false;
}
var month = ((""+result[3]).length < 2)?("0" + result[3]):("" + result[3]);
var day = ((""+result[4]).length < 2)? ("0" + result[4]):("" + result[4]);
strDate = result[1] + result[2] + month + result[2] + day;
var date = new Date(result[1], result[3]-1,result[4]);
month = ((date.getMonth() + 1) < 10)?("0" + (date.getMonth() + 1)):("" + (date.getMonth() + 1));
day = (date.getDate() < 10)?("0" + date.getDate()):("" + date.getDate());
var newStr=date.getFullYear() + result[2] + month + result[2] + day;
return newStr == strDate;
}

3、

闽ICP备16038512号-3 侵权投诉  ©2013-2023 360文档中心,www.360docs.net | 站点地图
本站资源均为网友上传分享，本站仅负责收集和整理，有任何问题请在对应网页下方投诉通道反馈