老早之前寫過乙個js日曆的方法,但是和dom耦合太強,並且邏輯複雜化,在原來的基礎上進行了優化,重寫了日曆方法。
效果圖如下,dom結構為乙個div,裡面包含了 7*6=42 個元素,左浮動排列
原始碼如下:
/*
* 日曆控制項
var dw = new dateweek(),
dt = new date();
dw.setdate(dt.getfullyear(),dt.getmonth()-0+1);
var list = dw.getdaylist(bool); //bool:true,自適應長度,會刪除首/尾不是當月的一周。bool:false,固定7行*6列=42條資料
list = [
...]*/
(function(window),
getweek: function(y, m, d)
}/*根據日期計算星期的公式*/
wk = (y - 1 + (y - 1) / 4 - (y - 1) / 100 + (y - 1) / 400 + d) % 7;
//0對應星期天,1對應星期一
return parseint(wk);
},getname: function(year,month,day),
getprev: function(y,m);
}else;}},
getnext: function(y,m);
}else;
};},
setday: function(date,day,siblings))
},clear: function(),
setdate: function(year, month)
//this.clear();
var name = null,
index = 0,
year = parseint(year),
month = parseint(month),
daytotal = this.getday(year, month),
weekfirst = this.getweek(year,month,1),
weeklast = this.getweek(year,month,daytotal);
//上月的資料
var prev = this.getprev(year, month),
prevdate = prev.d - weekfirst + 1;
for (var i=0; i=1; i--,len--)
}if (count==7) }}
return list;
},init: function();
this.daylist = ;
this.maxlen = 42;
return this;}}
function dateweek();
dateweek.prototype = proto;
dateweek.prototype.constructor = dateweek;
window.dateweek = dateweek;
})(window);
使用方法:
var dw = new dateweek(),
dt = new date();
dw.setdate(dt.getfullyear(), +dt.getmonth()+1);
var list = dw.getdaylist(1);
list的資料格式如下,
day:25,25號
siblings:true,不是當月的日。當前檢視的是3月的日曆,那麼2月和4月的siblings都會true,用於區分本月
week:星期。對應關係:0-星期日,1星期一,2星期二。。。
得到了日曆的list,剩下的就容易了。
getdaylist(bool)方法,傳入乙個bool值,為true,則去掉不包含當月的乙個星期的資料:
如何自己寫乙個日曆
在很多 都有自己的乙個日曆工具,有些看起來挺酷的,肯定有很多人想學.但在這裡我不是要寫乙個,而是給出它的設計過程,即它的靈魂.第一步 首先我們要選擇要顯示的年份和月份.第二步 獲得這個月的最大天數 參照前面一篇文章 第三步 建立乙個日期物件,這個日期物件為這個月的第一天.第四步 得到這個日期物件的星...
js寫乙個外掛程式
分號開頭,用於防止 壓縮合併時與其它 混在一起造成語法錯誤 而事實證明,uglify壓縮工具會將無意義的前置分號去掉,我只是習慣了這麼寫 function 立即執行函式,閉包,避免汙染全域性變數 通常乙個外掛程式只暴露乙個變數給全域性供其它程式呼叫 還有其它寫法,運算子 函式體 括號 例 funct...
收藏的乙個js日曆控制項
收藏的乙個js日曆控制項 setday.js function cnverycalendar if y 100 0 return 29 generate codes this.generatecalendartable function loop each days in current month...