javascript - 如何将“function init()”与我在 JavaScript 中的代码一起使用？

问题描述

我一直在修补我制作的一些代码。我正在寻找一种包含<form action="#" method="post" id="theForm"></form>在其中的方法。为什么？因为我在创建它时忘记将它添加到我的HTML中，我想知道我是否可以。有人告诉我，在没有它的情况下提交带有输入字段的提交在语义上是不正确的？

问题：如果我尝试添加 JS 代码：

function init() {
    'use strict';
    document.getElementById('theForm').onsubmit = insertyourfunctionhere;
}
window.onload = init;

结合 HTML <form action="#" method="post" id="theForm"></form>（理想情况下将包装器替换为我现有的代码），我找不到修改我的代码以使用此设置的方法。任何见解都会很棒。

这是我的代码： HTML：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Temperature Averager</title>
    <link rel="stylesheet" href="css/styles.css">
    <!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>

<body>

    <div class="grid-container">
        <div class="item1">
            <div class="wrapper">
                <fieldset>
                    <legend>Enter in two temperatures</legend>

                    <div><label for="tempLow">Low Temp:</label><input type="text" id="tempLow" required></div>



                    <div><label for="tempHigh">High Temp:</label> <input type="text" id="tempHigh" required></div>

                    <div><button id="submit" onclick="return validateForm()">Add the temperatures!</button></div>

                    <table id="myTable"></table>


                </fieldset>
            </div>
        </div>
    </div>


</body>

</html>

这是我的javascript：

var tempLOW = [];
var tempHIGH = [];

var i = 0;

var todayS = "";
var today = new Date();


function datePrint() {
    'use strict';
    var dd = today.getDate(),
        mm = today.getMonth() + 1,
        yyyy = today.getFullYear();

    if (dd < 10) {
        dd = '0' + dd;
    }

    if (mm < 10) {
        mm = '0' + mm;
    }

    todayS = mm + '/' + dd + '/' + yyyy;
    today.setDate(today.getDate() - 1);
}


function deleterow() {
    'use strict';
    var table = document.getElementById("myTable"),
        rowCount = table.rows.length;

    table.deleteRow(rowCount - 1);
}

function generateRow(dt, tL, tH) {
    'use strict';
    var table = document.getElementById("myTable"),
        row = table.insertRow(-1),
        cell1 = row.insertCell(0),
        cell2 = row.insertCell(1),
        cell3 = row.insertCell(2);
    cell1.innerHTML = dt;
    cell2.innerHTML = tL;
    cell3.innerHTML = tH;
}

function calcAvg() {
    'use strict';
    var table = document.getElementById("myTable"),
        sumLow = 0,
        sumHigh = 0,
        avgLow,
        avgHigh;

    for (var i = 0; i < tempLOW.length; i++) {
        sumLow += parseInt(tempLOW[i]);
        sumHigh += parseInt(tempHIGH[i]);
    }

    avgLow = sumLow / tempLOW.length;
    avgHigh = sumHigh / tempHIGH.length;

    generateRow("Averages", avgLow.toFixed(2), avgHigh.toFixed(2));

}

function validateForm() {

    var t1 = document.getElementById("tempLow").value;
    var t2 = document.getElementById("tempHigh").value;


    if (t1 == "" || t2 == "") {

        alert("Both temprature values must be entered");
        return false;

    } else {

        tempLOW.push(document.getElementById("tempLow").value);
        tempHIGH.push(document.getElementById("tempHigh").value);

        if (i == 0) {

            generateRow("Date", "LOW TEMP", "HIGH TEMP");
            datePrint();
            generateRow(todayS, t1, t2);

            calcAvg();
            i++;

        } else {
            deleterow();
            datePrint();
            generateRow(todayS, t1, t2);
            calcAvg();

            i++;

        }


    }

}

标签： javascripthtml

javascript - 如何将“function init()”与我在 JavaScript 中的代码一起使用？

问题描述

解决方案

推荐阅读