JS在表单提交之前输出所有已检查的输入字段值

时间:2014-08-27 08:16:47

标签: javascript php

我有一个包含多个复选框输入字段的订单。我想在提交表单之前向用户显示所做的选择。如果用户检查框中该框的值显示在段落中,则显示的js脚本按预期工作。问题是每个附加的选中复选框都会覆盖之前显示的结果。

如何更改脚本以输出所有选中的复选框?

这是PHP表单:

<input type="checkbox" onchange="toggleCheckbox(this)" value="1" name="1">
<input type="checkbox" onchange="toggleCheckbox(this)" value="2" name="2">
<input type="checkbox" onchange="toggleCheckbox(this)" value="3" name="3">
<input type="checkbox" onchange="toggleCheckbox(this)" value="4" name="4">
<input type="checkbox" onchange="toggleCheckbox(this)" value="5" name="5">
<input type="checkbox" onchange="toggleCheckbox(this)" value="6" name="6">
<input type="checkbox" onchange="toggleCheckbox(this)" value="7" name="7">

我使用的JavaScript:

<script type="text/javascript"> 
    function toggleCheckbox(element){
        if (element.checked){
        document.getElementById("test").innerHTML = element.value;
        }
        else document.getElementById("test").innerHTML = "";
} 
</script>

HTML字段:

<p id="test"></p>

1 个答案:

答案 0 :(得分:1)

+ = 不是 =

    function toggleCheckbox(element){
       if (element.checked)
         document.getElementById("test").innerHTML += " " + element.value;
       else 
         document.getElementById("test").innerHTML = 
            document.getElementById("test").innerHTML.replace(element.value, "");
    }