jsカレンダー関数object_javascriptスキル

需要によって引き起こされる問題: もともとインターネットで js コードを見つけようと思っていましたが、複雑すぎるか、制御が難しいか、互換性が低いことがわかりました...
問題分析: それが優れていることがわかりました。または最高...あなたに合ったものが最高です。
問題の解決策: カレンダー関数を自分で書くことにしました。
コードの提示:
カレンダーメインプログラム

コードをコピー コードは次のとおりです:

var Calendar={
STR:function(){with(this.data)return "" Y "年"、M "月"、D "数値、週" WN[W];},
V: function(o,spli,sx){with(this)return o[sx]="" data.Y spli data.M spli data.D},
T:function(){with(this)データを返します。TABLE}、
dnY:function(){with(this){calendarChange(data.Y 1,data.M-1,data.D)}}、
dnM:function(){with (this) {calendarChange(data.Y,data.M,data.D)}},
upY:function(){with(this){calendarChange(data.Y-1,data.M-1,data .D) }}、
upM:function(){with(this){calendarChange(data.Y,data.M-2,data.D)}}、
day:function(o){with (この) {data.D=o;calendarChange(data.Y,data.M-1,data.D)}}、
data:{Y:null,M:null,D:null,W:null ,H: null,U:null,YMD:null,YMD_C:"ホット",ARR:null,TABLE:null,MN:null,WN:null,SELECT:null,TADAY:new Date(),TADAY_C:"taday ",ROWLEN :7,VALUE:null}、
creatTable:function(){with(this){
var table=""
for(var i=0;i" t ""; }
for(data.ARR の var i){var showText=data.ARR[i]||" ",br=i�ta.ROWLEN,title,css;
if(!br){table =" "};
data.ARR[i]?title=data.Y "-" data.M "-" showText:title=""; data.TADAY .getDate())==String(data.ARR[i])?
(data.YMD.getFull Year()==data.TADAY.getFull Year()&&data.YMD.getMonth()==data .TADAY.getMonth()&&data.YMD.getDate()==data.TADAY.getDate())?
css=data.TADAY_C " " data.YMD_C:css=data.YMD_C:css=""; 🎜>table ="" showText "";
}table =""
data.TABLE=table;return table;
}},
calendarStarArr:function(userY,userM,userD){with(this){
var Arr=[]; now = new Date(userY,userM,userD);
var LastDay = now.getLastDay();
var FirstDayofWeek = now;data.Y=now .getFull Year( );
data.M=now.getMonth() 1;data.D=now.getDate();data.W=now.getDay();
while(Arr.length!=FirstDayofWeek ){Arr .push(false)}
for(var i=0;iwhile(Arr.length�ta.ROWLEN!=0) {Arr.push(false)}
data.ARR=Arr; return
}},
calendarChange:function(userY,userM,userD){with(this){
calendarStarArr( userY,userM ,userD);creatTable()
}},
calendarStar:function(userY,userM,userD){with(this){
data.MN = ["zero","one" ,"2","3","4","5","6","7","8","9","10","11","12"]; . WN = ["日","一","二","三","四","五","六"];
calendarChange(userY,userM,userD); 、
init:function(){with(this){
Date.prototype.getLastDay=function(){return(new Date(this.getFull Year(),this.getMonth() 1,0).getDate ( ))}
Date.prototype.FirstDayofWeek=function(){return(new Date(this.getFull Year(),this.getMonth(),1).getDay())}
calendarStar(new Date( ) .getFull Year(),new Date().getMonth(),new Date().getDate())
}}
}


コード適用の説明:

コードをコピー

コードは次のとおりです: var aa=new Calendar()// 新しいカレンダーを作成しますaa .init()//カレンダーの初期化

コードをコピー

コードは次のとおりです。 obj.innerHTML=aa.STR()//日付文字列を表示obj.innerHTML=aa.T()//テーブルを表示aa.dnY()//次へyearaa .upY()//前年

aa.dnM()//来月

aa.upM()//前月
aa.day(Number)//変更カレンダー表示 何の番号 (数値は数値パラメータを渡す必要があります)


このカレンダー オブジェクトは、
具体的にはカレンダーが配置される場所、
どのイベントがどのトリガーをトリガーするかという、カレンダーのコア機能を実装します。
もしそうだとしたら、このカレンダーを書く本来の目的がなくなってしまいます。
なぜ誰も反応しなかったのでしょうか? 例を見てみましょう。

コードは次のとおりです:

html,body{高さ:100%;幅:100%;}
*{マージン:0;パディング:0;}
.calendarBox{幅:100%;}
#calendar_control{背景:#a3a3b4;}
#calendar_control input{min-width:inherit;}
#calendarBox{幅:100%;高さ:100%;}
#calendar_str{cursor:pointer;text-align :center;font-weight:lighter;}
#calendar_body td{background:#f0f0f0;cursor:pointer;}
#calendar_body td.taday{background:#0CF;}
#calendar_body td.hot {background:#FF6;}
#calendar_body th{background:#3f526f;color:#fff;}
#calendar_body td,#calendar_body th{text-align:center;}
> ;

var Calendar={
STR:function(){with(this.data)return "" Y "年，" M "月，" D "号，星期" WN[W];},
V:function(spli){with(this)return "" data.Y spli data.M spli data.D},
T:function(){with(this)return data.TABLE},
dnY:function(){with(this){calendarChange(data.Y 1,data.M-1,data.D)}}、
dnM:function(){with(this){calendarChange(data.Y ,data.M,data.D)}},
upY:function(){with(this){calendarChange(data.Y-1,data.M-1,data.D)}},
upM:function(){with(this){calendarChange(data.Y,data.M-2,data.D)}}、
day:function(o){with(this){data.D=o ;calendarChange(data.Y,data.M-1,data.D)}}、
データ:{Y:null,M:null,D:null,W:null,H:null,U:null, YMD:null,YMD_C:"ホット",ARR:null,TABLE:null,MN:null,WN:null,SELECT:null,TADAY:new Date(),TADAY_C:"taday",ROWLEN:7,VALUE:null },
creatTable:function(){with(this){
var table=""
for(var i=0;i" t "";}
for(var i in data.ARR){var showText=data.ARR[i]||" ",br=i�ta.ROWLEN,title,css=" ";
if(!br){table =" "};
data.ARR[i]?title=data.Y "-" data.M "-" showText:title="";
if(String(data.D)==String(data.ARR[i])){css =" " data.YMD_C;}
if(data.YMD.getFull Year()==data.TADAY .getFull Year()&&data.YMD.getMonth()==data.TADAY.getMonth()&&String(data.TADAY.getDate())==String(data.ARR[i])){css=" " data.TADAY_C }
table ="" showText "";
}テーブル =""
data.TABLE=table;テーブルを返す;
}}、
calendarStarArr:function(userY,userM,userD){with(this){
var Arr=[];
var now = new Date(userY,userM,userD);
var LastDay = now.getLastDay();
var FirstDayofWeek = now.FirstDayofWeek();
data.YMD=now;data.Y=now.getFull Year();
data.M=now.getMonth() 1;data.D=now.getDate();data.W=now.getDay();
while(Arr.length!=FirstDayofWeek){Arr.push(false)}
for(var i=0;iwhile( Arr.length�ta.ROWLEN!=0){Arr.push(false)}
data.ARR=Arr;re​​turn Arr;
}}、
calendarChange:function(userY,userM,userD){with(this){
calendarStarArr(userY,userM,userD);creatTable()
}}、
calendarStar :function(userY,userM,userD){with(this){
data.MN = ["零","一","二","三","四","五","六" 、「七」、「八」、「九」、「十」、「十一」、「十二」];
data.WN = ["日","一","二","三","四","五","六"];
calendarChange(userY,userM,userD);
}}、
init:function(){with(this){
Date.prototype.getLastDay=function(){return(new Date(this.getFull Year(),this.getMonth() 1 ,0).getDate())}
Date.prototype.FirstDayofWeek=function(){return(new Date(this.getFull Year(),this.getMonth(),1).getDay())}
CalendarStar(new Date().getFull Year(),new Date().getMonth(),new Date().getDate())
}}
}

calendar.init()
function CalendarChange(){
var Calendar_body=document.getElementById("calendar_body")
calendar_body.innerHTML=calendar.T()//表示表格
var Calendar_str=document.getElementById("calendar_str")
calendar_str.innerHTML=calendar.STR()//显示日期字符串
calendarControl()//调用日历制御
}
calendarChange()/ /日历更新
function CalendarControl(){
var Calendar_str=document.getElementById("calendar_str")
calendar_str.onclick=function(){ Calendar.init();calendarChange()}//今天を返す機能实现
var Calendar_dnY=document.getElementById("calendar_dnY")
calendar_dnY.onclick=function(){ Calendar.dnY();calendarChange()}//下一年 機能实现
var Calendar_dnM= document.getElementById("calendar_dnM")
calendar_dnM.onclick=function(){ Calendar.dnM();calendarChange()}//下一月功能实现
var Calendar_upY=document.getElementById("calendar_upY")
calendar_upY.onclick=function(){ Calendar.upY();calendarChange()}//上一年功能实现
var Calendar_upM=document.getElementById("calendar_upM")
calendar_upM.onclick=function (){ Calendar.upM();calendarChange()}//上一月功能实现
var Calendar_day=document.getElementById("calendar_body").getElementsByTagName("td");
for(calendar_day の var i){calendar_day[i].onclick=function(){var N=Number(this.innerText);if(N){calendar.day(N);calendarChange()}}} //当天日期功能实现
}