0

なぜこれが発火しないのか私にはわかりません。私はそれに多くの時間を費やしたくありませんでした。誰にもアイデアはありますか？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<SCRIPT TYPE="text/javascript">
    function getTimes(){
        var minuteOne = document.getElementById(minOne).value;
        var minuteTwo = document.getElementById(minTwo).value;
        var minuteThree = document.getElementById(minThree).value;
        var minuteFour = document.getElementById(minFour).value;
        var minuteFive = document.getElementById(minFive).value;
        var hourOne = document.getElementById(hourOne).value;
        var hourTwo = document.getElementById(hourTwo).value;
        var hourThree = document.getElementById(hourThree).value;
        var hourFour = document.getElementById(hourFour).value;
        var hourFive = document.getElementById(hourFive).value;
        var totalMinutes = minuteOne + minuteTwo + minuteThree + minuteFour + minuteFive;
        var extraHours = totalMinutes / 60;
        var minutesLeft = totalMinutes % 60;
        var totalHours = hourOne + hourTwo + hourThree + hourFour + hourFive + extraHours;

        document.getElementById(totalMinute).value = minuteLeft;
        document.getElementById(totalHour).value = totalHours;
    }
</SCRIPT>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Time Calculator</title>

</head>

<body>

    <table>
        <tr align="center">
            <td>Day</td><td>Hour</td><td>Minutes</td>
        </tr>
        <tr>
            <td>Monday</td><td><input name="hourOne" id="hourOne" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td><td><input name="minOne" id="minOne" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td>
        </tr>
        <tr>
            <td>Tuesday</td><td><input name="hourTwo" id="hourTwo" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td><td><input name="minTwo" id="minTwo" type="text" size="5" maxlength="5" value="0" onblur="getTimes()"/></td>
        </tr>
        <tr>
            <td>Wednesday</td><td><input name="hourThree" id="hourThree" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td><td><input name="minThree" id="minThree" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td>    
        </tr>
        <tr>
            <td>Thursday</td><td><input name="hourFour" id="hourFour" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td><td><input name="minFour" id="minFour" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td>   
        </tr>
        <tr>
            <td>Friday</td><td><input name="hourFive" id="hourFive" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td><td><input name="minFive" id="minFive" type="text" size="5" maxlength="5" value="0" onblur="getTimes()" /></td>    
        </tr>
        <tr>
            <td>Total Time</td><td><input name="totalHour" id="totalHour" type="text" size="5" maxlength="5" value="0" /></td><td><input name="totalMinute" type="text" id="totalMinute" size="5" maxlength="5" value="0" /></td>
        </tr>
    </table>
    <input name="getTime" type="button" value="Get Time" onclick="getTimes()" />

</body>
</html>
4

3 に答える 3

4

document.getElementById文字列を取ります。あなたはそれに宣言されていない値を与えています：

var minuteOne = document.getElementById(minOne).value;

する必要があります

var minuteOne = document.getElementById("minOne").value;

引用符に注意してください。次に、この行:minuteOne + minuteTwo + minuteThree + minuteFour + minuteFiveは文字列を連結しており、加算を行っていません。parseInt文字列を連結するのではなく、すべての値を呼び出す必要があります。

第三に、この行

document.getElementById('totalMinute').value = minuteLeft;

する必要があります

document.getElementById('totalMinute').value = minutesLeft;

変数を参照するタイプミスがあったようです。すべての修正を適用すると、JavaScript は次のようになります。

function getTimes(){
    var minuteOne = parseInt(document.getElementById('minOne').value);
    var minuteTwo = parseInt(document.getElementById('minTwo').value);
    var minuteThree = parseInt(document.getElementById('minThree').value);
    var minuteFour = parseInt(document.getElementById('minFour').value);
    var minuteFive = parseInt(document.getElementById('minFive').value);
    var hourOne = parseInt(document.getElementById('hourOne').value);
    var hourTwo = parseInt(document.getElementById('hourTwo').value);
    var hourThree = parseInt(document.getElementById('hourThree').value);
    var hourFour = parseInt(document.getElementById('hourFour').value);
    var hourFive = parseInt(document.getElementById('hourFive').value);
    var totalMinutes = minuteOne + minuteTwo + minuteThree + minuteFour + minuteFive;
    var extraHours = Math.floor(totalMinutes / 60);
    var minutesLeft = totalMinutes % 60;
    var totalHours = hourOne + hourTwo + hourThree + hourFour + hourFive + extraHours;
    document.getElementById('totalMinute').value = minutesLeft;
    document.getElementById('totalHour').value = totalHours;
}

そして、それはうまくいくようです。

于 2011-06-13T17:57:36.983 に答える
1

document.getElementById(totalMinute).value = minuteLeft;

する必要があります

document.getElementById(totalMinute).value = minutesLeft;

常に変数名を確認してください。

于 2011-06-13T17:57:50.977 に答える
1 
getElementById(minOne)

実際にリテラル文字列として使用しようとしているときに、minOneなどを変数として渡しています。代わりに引用符で囲みます。

getElementById("minOne")

于 2011-06-13T17:59:09.167 に答える