JavaScript 复选框只提交一个输入

Question

我在提交复选框时遇到问题。代码如下:

JavaScript

function init () {
    document.getElementById("pizza").topping[0].checked=true;
    document.getElementById("btn").onclick=poll;
}
onload = init;

function poll () {
    var i, isOK, summary="";
    var form=document.getElementById("pizza");
    for (i=0; i < form.topping.length; i++) {
        if (form.topping[i].checked) {
            summary+=form.topping[i].value+" ";
        }
    }
    isOK = confirm("Submit these choices?\n" + summary);
    if (isOK) {
        form.submit();
    } else {
        return false;
    }
}

HTML

<form id="pizza" action="poll.php" method="POST">
    <div id="panel">Pizza Topping?
        <input type="checkbox" name="topping" value="Cheese">Cheese</input>
        <input type="checkbox" name="topping" value="Ham">Ham</input>
        <input type="checkbox" name="topping" value="Peppers">Peppers</input>
        <input id="btn" type="button" value="Confirm Choices"></input>
    </div>
</form>

poll.php

<?php
    echo "<br>***************<br>";
    var_dump($_POST);
    echo '*********************';
?>

JS确认信息: 提交这些选择？ 奶酪辣椒

poll.php 的输出:

---

数组(大小=1) 'topping' => string 'Peppers' (length=7)

---

所以我的问题是:我检查了 Cheese and Peppers，但只提交了 Peppers。谁能帮帮我？

Answer 1

给输入元素一个类似名称的数组(后缀[])

<input type="checkbox" name="topping[]" value="Cheese">Cheese</input>
<input type="checkbox" name="topping[]" value="Ham">Ham</input>
<input type="checkbox" name="topping[]" value="Peppers">Peppers</input>