授業表は先週と来週です。

7600 ワード

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>   </title>

    <script>

        var currDT;

        var aryDay = new Array(" ", " ", " ", " ", " ", " ", " ");



        //     

        function initWeek(date) {

            if (date == undefined) {

                currDT = new Date();

            } else {

                currDT = new Date(date);

            }

            showDate();

        }



        //          

        function addWeek(ope) {

            var num = 0;

            if (ope == "-") {

                num = -7;

            }

            else if (ope == "+") {

                num = 7;

            }

            currDT = addDate(currDT, num);

            showDate();

            return currDT;

        }



        function showDate() {

            span1.innerHTML = currDT.toLocaleDateString(); //     

            var dw = currDT.getDay();

            var tdDT;

            //        

            if (dw == 0) {

                tdDT = addDate(currDT, -6);

            }

            else {

                tdDT = addDate(currDT, (1 - dw));

            }

            //            

            var objTB = document.getElementById("trWeek");

            for (var i = 0; i < 7; i++) {

                if (tdDT.toLocaleDateString() == currDT.toLocaleDateString()) {

                    objTB.cells[i + 1].style.color = "red"; //currDT     

                }

                dw = tdDT.getDay();

                var month = (tdDT.getMonth() + 1) < 10 ? "0" + (tdDT.getMonth() + 1) : (tdDT.getMonth() + 1);

                var date = tdDT.getDate() < 10 ? "0" + tdDT.getDate() : tdDT.getDate();

                objTB.cells[i + 1].innerHTML = "  " + aryDay[dw] + "<br />[" + tdDT.getFullYear() + "-" + month + "-" + date + "]";

                tdDT = addDate(tdDT, 1); //    

            }

        }



        //        ,  num      ,   ,    

        function addDate(dt, num) {

            var ope = "+";

            if (num < 0) {

                ope = "-";

            }



            var reDT = dt;

            for (var i = 0; i < Math.abs(num) ; i++) {

                reDT = addOneDay(reDT, ope);

            }

            return reDT;

        }



        //       , ope  , +   ,-   ,     

        function addOneDay(dt, ope) {

            var num = 0;

            if (ope == "-") {

                num = -1;

            }

            else if (ope == "+") {

                num = 1;

            }



            var y = dt.getFullYear();

            var m = dt.getMonth();

            var lastDay = getLastDay(y, m);



            var d = dt.getDate();

            d += num;

            if (d < 1) {

                m--;

                if (m < 0) {

                    y--;

                    m = 11;

                }

                d = getLastDay(y, m);

            }

            else if (d > lastDay) {

                m++;

                if (m > 11) {

                    y++;

                    m = 0;

                }

                d = 1;

            }



            var reDT = new Date();

            reDT.setYear(y);

            reDT.setMonth(m);

            reDT.setDate(d);



            return reDT;

        }



        //      

        function isLeapYear(y) {

            var isLeap = false;

            if (y % 4 == 0 && y % 100 != 0 || y % 400 == 0) {

                isLeap = true;

            }

            return isLeap;

        }



        //       

        function getLastDay(y, m) {

            var lastDay = 28;

            m++;

            if (m == 1 || m == 3 || m == 5 || m == 7 || m == 8 || m == 10 || m == 12) {

                lastDay = 31;

            }

            else if (m == 4 || m == 6 || m == 9 || m == 11) {

                lastDay = 30;

            }

            else if (isLeapYear(y) == true) {

                lastDay = 29;

            }

            return lastDay;

        }

        //          

        function getAnyWeekStart(date) {

            var currentDay = date.getDay();

            if (currentDay == 0) { currentDay = 7; }

            var mondayTime = date.getTime() - (currentDay - 1) * 24 * 60 * 60 * 1000;

            var startTime = new Date(mondayTime).Format("yyyy/MM/dd");

            return startTime;



        }

        //          

        function getAnyWeekEnd(date) {

            var currentDay = date.getDay();

            if (currentDay == 0) { currentDay = 7; }

            var sundayTime = date.getTime() + (7 - currentDay) * 24 * 60 * 60 * 1000;

            var endTime = new Date(sundayTime).Format("yyyy/MM/dd");

            return endTime;

        }



        function dockPostion(date) {

            //currDT = new Date(date);

            //var start = getAnyWeekStart(currDT);

            //var end = getAnyWeekEnd(currDT);

            initWeek(date);

        }



        window.onload = function () {

            date.value = new Date().toLocaleDateString();

            initWeek();

        }

    </script>

</head>

<body>

    <div>

        <center>

            <button style="cursor:hand;font-weight:bold;" onclick="addWeek('-')" title="   ">←</button> 

            <span id="span1"></span>

            <button style="cursor:hand;font-weight:bold;" onclick="addWeek('+')" title="   ">→</button> 

        </center>

    </div>

    <div style="margin-top: 10px;">

        <center>

        <h3>   </h3>

        <table id="tb1" border="1" style="font-size: 10pt">

            <thead>

                <tr id="trWeek">

                    <th>  /  </th>

                    <th></th>

                    <th></th>

                    <th></th>

                    <th></th>

                    <th></th>

                    <th></th>

                    <th></th>

                </tr>

            </thead>

            <tbody>

                <tr>

                    <td>   </td>

                    <td></td>

                    <td></td>

                    <td></td>

                    <td></td>

                    <td></td>

                    <td></td>

                    <td></td>

                </tr>

            </tbody>

        </table>

        </center>

        <div style="margin-top:15px;">

            <center>

                <input id="date" type="text" />

                <button onclick="dockPostion(date.value)">    </button>

            </center>

        </div>

    </div>

</body>

</html>