2

1 つの入力の値を他の 2 つの入力の合計に対してチェックするバリデーターが必要なフォームのセクションがあります。JavaScript構文の正しい書き方がわからないので、表現が間違っていたらすみません。

<form id="RSVP-form">

<label> Number of Guests </label>
<input type="number" name="ppl-number" required="required" size="4" maxlength="2" />

<label> Chicken Marsala </label>
<input type="range" name="chicken" min="0" max="10" value="0" />

<label> Steak and Salmon </label>
<input type="range" name="steak" min="0" max="10" value="0" />

<button type="submit">Submit RSVP</button>

</form>

value("ppl-number") = value("chicken"+"steak") を確認するスクリプトを作成する必要があります。どうすればいいかわからない？いくつかの例を見てきましたが、何度か試行してもスクリプトが正しく機能しないようです。

前もって感謝します！

4

2 に答える 2

0

次のようなものを使用します。

<script>
function validatecount()
{
    var chicken_count = document.getElementById("chicken").value;
    var steak_count = document.getElementById("steak").value;
    var total = document.getElementById("ppl-number").value;
    var sum = parseInt(chicken_count) + parseInt(steak_count);
    alert(sum);
    alert(total);
    if (sum == total)
    {
    document.RSVP-form.submit();
    } else {
        alert("Error Message!");
    }
}
</script>
<form id="RSVP-form">

    <label> Number of Guests </label>
    <input type="number" name="ppl-number" id="ppl-number"
           required="required" size="4" maxlength="2" />

    <label> Chicken Marsala </label>
    <input type="range" name="chicken" id="chicken" min="0" max="10" value="0" />

    <label> Steak and Salmon </label>
    <input type="range" name="steak" id="steak" min="0" max="10" value="0" />

    <button type="submit" onclick="validatecount()">Submit RSVP</button>

</form>
于 2012-07-17T22:42:33.900 に答える
0

イベントリスナーを送信イベントに添付して、数値を比較するだけです。入力タイプを数値として指定できる場合でも、文字列が返されるため、計算を行う前にそれを数値に解析する必要があることを忘れないでください。

document.getElementById("RSVP-form").addEventListener("submit", function (e) {
    var form = this,
        amountChicken = parseInt(form.elements.["chicken"].value, 10),
        amountSteak = parseInt(form.elements.["steak"].value, 10),
        peopleCount = parseInt(form.elements.["ppl-number"].value, 10);

    if (amountChicken + amountSteak !=== peopleCount) {
        alert("Portions and people don't match!");
        return false;
    };
});
于 2012-07-17T22:20:55.657 に答える