カレンダーを作成するためのチュートリアルに従っています。カレンダーの最初のビットを作成しましたが、前月と来月に移動するボタンを作成するためのコードを追加した後、機能しなくなりました:(
ieでこのエラーが発生します
Webページエラーの詳細メッセージ:'document.getElementById(...)'がnullであるか、オブジェクトではありません行:23文字:4コード:0
カレンダーの代わりに処理を表示するだけです。
誰かが素晴らしいと思われるものを見ることができれば、ここにコードがあります
calendar_start.php- http://tinypic.com/r/sdo19t/6(すべての場所でコードを作成するために4行のスペースを空けることができないため、写真をアップロードする必要がありました)。
show_calendar.php(これはカレンダーを表示できるはずのファイルです
<!DOCTYPE html>
<html>
<head>
<link href="calCss.css" rel="stylesheet" type="text/css" media="all" />
<script language="JavaScript" type="text/javascript">
function initialCalendar(){
var hr = new XMLHttpRequest();
var url = "calendar_start.php";
var currentTime = new Date();
var month = currentTime.getMonth() + 1;
var year = currentTime.getFullYear();
showmonth = month;
showyear = year;
var vars = "showmonth="+showmonth+"&showyear="+showyear;
hr.open("POST", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("showcalendar").innerHTML = return_data;
}
}
hr.send(vars);
document.getElementById("showCalendar").innerHTML = "processing...";
}
</script>
<script language="JavaScript" type="text/javascript">
function next_month(){
var nextmonth = showmonth + 1;
if (nextmonth > 12) {
nextmonth = 1;
showyear = showyear + 1;
}
showmonth = nextmonth;
var hr = new XMLHttpRequest();
var url = "calendar_start.php";
var vars = "showmonth="+showmonth+"&showyear="+showyear;
hr.open("POST", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("showcalendar").innerHTML = return_data;
}
}
hr.send(vars);
document.getElementById("showCalendar").innerHTML = "processing...";
}
</script>
<script language="JavaScript" type="text/javascript">
function last_month(){
var lastmonth = showmonth - 1;
if (lastmonth < 1) {
lastmonth = 12;
showyear = showyear - 1;
}
showmonth = lastmonth;
var hr = new XMLHttpRequest();
var url = "calendar_start.php";
var vars = "showmonth="+showmonth+"&showyear="+showyear;
hr.open("POST", url, true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("showcalendar").innerHTML = return_data;
}
}
hr.send(vars);
document.getElementById("showCalendar").innerHTML = "processing...";
}
</script>
</head>
<body onLoad="initialCalendar();">
<div id="showCalendar"></div>
</body>
</html>
calCss.css(以前は機能していたので、これで問題ないと思います)
#calendar_wrap {
width: 924px;
margin-left: auto;
margin-right: auto;
overflow: hidden;
}
.title_bar {
width: 100%;
height: 30px;
}
.previous_month {
float: left;
width: 308px;
height: 30px;
text-align: left;
}
.show_month {
float: left;
width: 308px;
height: 30px;
text-align: center;
}
.next_month {
float: left;
width: 308px;
height: 30px;
text-align: right;
}
.week_days {
width: 100%;
}
.days_of_the_week {
float: left;
width: 14%;
text-align: center;
}
.cal_day {
position: relative;
float: left;
margin-right: 4px;
margin-bottom: 4px;
width: 128px;
height: 95px;
background-color: #9C9;
}
.day_heading {
position: relative;
float: left;
width: 40px;
height: 16px;
padding: 6px;
color: #000;
font-family: Arial;
font-size: 14px;
}
.openings {
width: 100%;
clear:left;
text-align: center;
}
.non_cal_day {
position: relative;
float: left;
margin-right: 4px;
margin-bottom: 4px;
width: 128px;
height: 95px;
background-color: #CCC;
}
.clear {
clear: both;
}
うまくいけば、それは単純なものであり、これは非常に新しいものです:)/:(ローカルホストとは関係ありません