Question

我想查看我的足球投注游戏示例的3个输入。它有效，但我的表单中有3个以上的输入。我想查看3个输入的 MINIMUM 。

三个输入组包含两个type =“text”字段和一个type = checkbox。

以下是我的HTML代码：

<form id="AddTip" onsubmit="return chkAddTip()" action="Ctipservlet" method="POST">
    <h1>Bet the Games</h1>
    <table>
        <tr><th>Playtime</th> <th>Games</th><th>Your bets</th><th>Confirmation</th></tr>
        <tr>
            <td>20:00 pm</td>
            <td>Dortmund - Bayern</td>
            <td><input type="text" name="team_a0" maxlength="2" size="2">:<input type="text" name="team_b0" maxlength="2" size="2"></td>
            <td><input type="checkbox" name="check0"></td>
        </tr>
        <tr>
            <td>19:00 pm</td>
            <td>Dortmund - Schalke</td>
            <td><input type="text" name="team_a1" maxlength="2" size="2">:<input type="text" name="team_b1" maxlength="2" size="2"></td>
            <td><input type="checkbox" name="check1"></td>
        </tr>
    </table>
    <input type="submit" name="tip" value="Get your bet">
    <input type="submit" onclick="this.form.onsubmit = null" name="back" value="Back">

这是我的JavaScript功能：

function chkAddTip(){
    var inputs = document.getElementById('AddTip').getElementsByTagName('input');

    for (var i = 0; i < inputs.length; i += 3){
        if (inputs[i].type !== "submit" && (!inputs[i].value || !inputs[i + 1].value || !inputs[i + 2].checked)){
            alert("Bitte deinen Tipp und die Bestättigung abgeben.")
            inputs[i].focus();
            return false;
        }
    }
}

Answer 1

创建一个布尔标志，当找到有效的赌注时，您将其设置为true。该标志设置为true后立即退出循环。在循环之后，根据标志的值执行所需操作。

function chkAddTip(){
    var inputs = document.getElementById('AddTip').getElementsByTagName('input');

    // boolean flag
    var foundValid = false;

    // early exit the loop if at least one valid bet has been found
    for (var i = 0; i < inputs.length && !foundValid; i += 3){
        if (inputs[i].type !== "submit" && (inputs[i].value && inputs[i + 1].value && inputs[i + 2].checked)) {
            // set the flag to true when a valid bet is found
            foundValid = true;
        }
    }

    // determine the return value depending on the flag
    if (foundValid) {
        return true;
    }
    else {
        alert("Bitte deinen Tipp und die Bestättigung abgeben.")
        inputs[0].focus();
        return false;
    }
}

如何在表单验证中构建具有三个输入的组？

1 个答案: