Q&A
質問者さんの考える「メモ機能」とはどう定義づけして、UIや機能をどのように考えていますか。要するに、メモした内容をどこに保持するのでしょうかと。カレンダーの表示は計算ごとなので特に保持する話はないと思いますが、どこかの日付になんらかのメモを残す場合、メモした内容をどこに保持するのだろうかと。
カレンダーの日付のところにメモ機能をつけるためにテキストエリアをつけたいのですがどうしても入れることができません```<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html> <head> ・・・・・・・・・ <link href="calender.css" rel="stylesheet" type="text/css"> <script type="text/javascript"><!-- var monthdays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31); var days = new Array("日", "月", "火", "水", "木", "金", "土"); // 祝日1：何月の何日か？ var Holidays1 = new Array(1,1, 2,11, 3,21, 4,29, 5,3, 5,4, 5,5, 9,23, 11,3, 11,23, 12,23); // 祝日2：何月の第何月曜日か？ var Holidays2 = new Array(1,2, 7,3, 9,3, 10,2); // 現在の年、月、日の取得 var now = new Date(); var thisYear = now.getFullYear(); var thisMonth = now.getMonth() + 1; var today = now.getDate(); // 表示年月の記憶 var year = thisYear; var month = thisMonth; function showCalen(n) { month += n; if (month == 0) { year--; month=12; } else if (month == 13) { year++; month = 1; } var flag = (year == thisYear && month == thisMonth) ? 1: 0; var date = new Date(year, month-1, 1); // 表示月の 1日の Date() var startDay = date.getDay(); var dateMax = monthdays[month - 1]; if (month == 2 && ((year%4 == 0 && year%100 != 0) || year%400 == 0)) dateMax = 29; // 休日配列の初期化 var holidays = new Array(); for (var i = 0; i <= dateMax; i++) holidays[i] = 0; // 祝日1 の処理 var firstSunday = (startDay == 0) ? 1: 8 - startDay; for (i = 0; i < Holidays1.length; i += 2) { if (Holidays1[i] == month) { holidays[Holidays1[i+1]] = 1; for (var j = firstSunday; j < dateMax; j += 7) if (Holidays1[i+1] == j ) { holidays[j+1] = 1; break; } // 振替休日 } } // 祝日2 の処理 var mondays = new Array(); var firstMonday = (startDay < 2) ? 2 - startDay: 9 - startDay; for (i = 0; i < Holidays2.length; i += 2) if (Holidays2[i] == month) holidays[(Holidays2[i+1] - 1) * 7 + firstMonday] = 1; var htmlStr = "<table class='calen'>\n" + "<tr class='bg1'><th colspan=7>" + year + "年 " + month + "月</th></tr>\n"; htmlStr += "<tr class='bg2'><th class='sun'>" + days[0] + "</th>"; for (i = 1; i < 6; i++) htmlStr += "<th>" + days[i] + "</th>"; htmlStr += "<th class='sat'>" + days[6] + "</th></tr>\n"; var col = 0; if (startDay > 0) { htmlStr += "<tr>"; for ( ; col < startDay; col++) htmlStr += "<td> </td>"; } for (i = 1; i <= dateMax; i++) { if (col == 0) htmlStr += "<tr>"; if (flag == 1 && i == today) { if (holidays[i] == 1 || col == 0) htmlStr += "<td class='today sun'>"; else if (col == 6) htmlStr += "<td class='today sat'>"; else htmlStr += "<td class='today'>"; } else if (holidays[i] == 1 || col == 0) htmlStr += "<td class='sun'>"; else if (col == 6) htmlStr += "<td class='sat'>"; else htmlStr += "<td>"; htmlStr += i + "</td>"; if (col == 6) { htmlStr += "</tr>\n"; col=0; } else col++; } if (col != 0) { for ( ; col < 7; col++) htmlStr += "<td> </td>"; htmlStr += "</tr>"; } htmlStr += "</table>"; document.getElementById("calen").innerHTML = htmlStr; } //--> </script> </head> <body onload="showCalen(0)"> <p><input type="button" value="前月" onclick="showCalen(-1)"> <input type="button" value="次月" onclick="showCalen(1)"></p> <div id="calen"></div> </body> </html> コード ```
あと、質問内容って、何回も編集できるので、こちらの質問を削除して、先の質問の方に統合したほうが良いよ。
マークダウンのcode機能ミスってます。
基本はコード部分を選択状態→codeボタン だけで良いです
回答1件
0
ベストアンサー
単純に日付の部分にテキストエリアを入れたいのであれば、JSで日付を入れている箇所にテキストエリアを入れてあげるようにしてあげれば良いと思います。
js
1htmlStr += i + "<textarea></textarea></td>"; // textareaを追加
ただテキストエリアはブラウザ上で大きさを調整することができるので、幅や高さを変えると今のままだとデザインは崩れます。この部分は自分の想定するデザインとなるよう調整してみてください。
投稿2020/01/24 03:45
総合スコア348
あなたの回答
tips
プレビュー
