質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

2441閲覧

javascript 万年カレンダー

nerd

総合スコア37

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2016/05/12 13:29

編集2016/05/12 13:30

###Javascript にて万年カレンダーを作成しております。
目的
前任者作成の万年カレンダーJSを改造している形
CSVを呼び込み休日として表示

###発生している問題・エラーメッセージ
休日の設定として現在holyday["2016/5/24"] = 0;
としてありました。
これをCSVデータを呼び込みholyday配列に追加

function

1 var req = new XMLHttpRequest(); 2 req.open("get", "js/date.csv", true); 3 req.send(null); 4 req.onload = function(){ 5 convertCSVtoArray(req.responseText); 6 } 7 } 8 function convertCSVtoArray(str){ 9 var tmp = str.split(","); 10 for(var i=0;i<tmp.length;++i){ 11 holyday[tmp[i]] = 0; 12 } 13 } 14 getCSV();

その後

var cal_day_match = year + "/" + month + "/" + cal_day_cnt; if(holyday[cal_day_match] != undefined){ dayClass = ' class="holyday"'; }

としていますがうまく適応されない感じです。

CSV

2016/5/13,2016/5/18,2016/5/16,2016/5/23

js

<!-- var classNames = new Array('holyday','saleday','mailday'); var holyday = new Object(); holyday["2016/5/24"] = 0; holyday["2016/5/25"] = 0; var today = new Date(); var cal_year = today.getYear(); var cal_month = today.getMonth() + 1; var cal_day = today.getDate(); if (cal_year < 1900) cal_year += 1900; document.write("<div id='calendar'></div>"); var cal = document.getElementById("calendar"); var defaultBackgroundColors = new Object(); var to_year = cal_year; var to_month = cal_month; var to_day = cal_day; function currentCal(){ cal_year = to_year; cal_month = to_month; cal_day = to_day; writeCal(cal_year,cal_month,cal_day); } function prevCal(){ cal_month -= 1; if(cal_month < 1){ cal_month = 12; cal_year -= 1; } writeCal(cal_year,cal_month,0); } function nextCal(){ cal_month += 1; if(cal_month > 12){ cal_month = 1; cal_year += 1; } writeCal(cal_year,cal_month,0); } function getWeek(year,month,day){ if (month == 1 || month == 2) { year--; month += 12; } var week = Math.floor(year + Math.floor(year/4) - Math.floor(year/100) + Math.floor(year/400) + Math.floor((13 * month + 8) / 5) + day) % 7; return week; } function getCSV(){ var req = new XMLHttpRequest(); req.open("get", "js/date.csv", true); req.send(null); req.onload = function(){ convertCSVtoArray(req.responseText); } } function convertCSVtoArray(str){ var tmp = str.split(","); for(var i=0;i<tmp.length;++i){ holyday[tmp[i]] = 0; } } getCSV(); function writeCal(year,month,day){ var calendars = new Array(0,31,28,31,30,31,30,31,31,30,31,30,31); var weeks = new Array("sun","mon","tue","wed","thu","fri","sat"); var monthName = new Array('none','1','2','3','4','5','6','7','8','9','10','11','12'); var cal_flag = 0; if(year % 100 == 0 || year % 4 != 0){ if(year % 400 != 0){ cal_flag = 0; } else{ cal_flag = 1; } } else if(year % 4 == 0){ cal_flag = 1; } else{ cal_flag = 0; } calendars[2] += cal_flag; var cal_start_day = getWeek(year,month,1); var cal_tags = "<table border='0' cellspacing='0' cellpadding='0' align='center'><tr height='10'></tr><tr><td><span onClick='prevCal();' class='arrow'>&laquo;&nbsp;</span></td>"; cal_tags += "<td height='25' align='center' valign='middle' bgcolor='#000000'><span class='now_month'>" + monthName[month] + "</span></td>"; cal_tags += "<td><span onClick='nextCal();' class='arrow'>&nbsp;&raquo;</span></td></tr><tr height='10'></tr></table>" ; cal_tags += "<table border='0' cellspacing='0' cellpadding='0' class='calendar'>"; cal_tags += "<tr class='headline'>"; for(var i=0;i<weeks.length;i++){ if(i==0){cal_tags += "<td class='dsun'>" + weeks[i] + "</td>";} else if( i==6){cal_tags += "<td class='dsat'>" + weeks[i] + "</td>";} else{ cal_tags += "<td class='dnormal'>" + weeks[i] + "</td>"; } } cal_tags += "</tr><tr>"; for(var i=0;i < cal_start_day;i++){ cal_tags += "<td >&nbsp;</td>"; } //main for(var cal_day_cnt = 1;cal_day_cnt <= calendars[month];cal_day_cnt++){ var cal_day_match = year + "/" + month + "/" + cal_day_cnt; var dayClass = ""; if(holyday[cal_day_match] != undefined){ dayClass = ' class="holyday"'; } else if(cal_day_cnt == day){ dayClass = ' class="Today"'; } else if(cal_start_day == 0){ dayClass = ' class="Sun"'; } else if(cal_start_day == 6){ dayClass = ' class="Sat"'; } cal_tags += "<td "+dayClass+">" + cal_day_cnt + "</td>"; if(cal_start_day == 6){ cal_tags += "</tr>"; if(cal_day_cnt < calendars[month]){ cal_tags += "<tr>"; } cal_start_day = 0; } else{ cal_start_day++; } } while(cal_start_day <= 6 && cal_start_day != 0){ cal_tags += "<td>&nbsp;</td>"; if(cal_start_day == 6){ cal_tags += "</tr>"; } cal_start_day++; } cal_tags += "</table>"; cal.innerHTML = cal_tags; } writeCal(cal_year,cal_month,cal_day); //-->

何がいけないのかわからなくなってしまっております。
初歩的なご質問で恐縮ではありますがご教授お願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

XMLHttpRequest は非同期で動くため、CSVが送られてくる前に writeCal(cal_year,cal_month,cal_day); が実行されているのではないでしょうか。
なので function convertCSVtoArray 内で writeCal を呼ぶ実装に変えるのが早いと思います。

投稿2016/05/12 14:41

kei344

総合スコア69364

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

nerd

2016/05/12 15:07

kei344様 ご教授誠にありがとうございました。 まさに、ご指摘のところを変更いたしましたら動作いたしました。 2日くらい悩んでおりました。 大変助かりました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問