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

Question

我有一个包含多个复选框输入字段的订单。我想在提交表单前向用户显示所做的选择。下图所示的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> 

Answer 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, ""); 
    }