获取用户输入（项目）并按排序顺序在屏幕上重新打印它们

Question

所以，我很新，我正在学习网页设计课程。

我的任务是构建一个表单，该表单接受用户输入的 10 个字段并对输入进行排序，然后将其与当前日期和时间一起显示在网页中。

我将在稍后对时间/日期进行排序..

首先，我使用表格创建了一个包含所有上述输入字段的表单。 输入类型=“文本”必需=“必需”名称=“螺旋桨”最大长度=“20”值=“” 等等……

然后我使用变量编写了一个函数，然后将变量放入一个名为附件的数组中：

<script>

function gopro() {
parts.sort();
parts.reverse();
var input = document.getElementById("Propellers").value;
var input = document.getElementById("Batteries").value;
var input = document.getElementById("Gimbal").value;
var input = document.getElementById("Micro_HDMI").value;
var input = document.getElementById("Camera_Housing").value;
var input = document.getElementById("Carry_Bag").value;
var input = document.getElementById("Stabilization").value;
var input = document.getElementById("Karma_Drone").value;
var input = document.getElementById("Karma_Grip").value;
var input = document.getElementById("Hero_6_Camera").value;
var accessories = [Propellers, Batteries, Gimbal, Micro_HDMI, Camera_Housing, Carry_Bag, Karma_Drone, Karma_Grip, Hero_6_Camera];
document.getElementById("parts").innerHTML = accessories;   

}
</script>

然后我在单击按钮时调用该函数 onclick="gopro()

在页面上显示（返回）输入值：

id="零件"

但是当我单击提交按钮时，表单会重置。想知道为什么表单只是重置而不是在网页上产生输出？

谢谢

Answer 1

表单被提交到它的action属性，如果没有提供action，表单被提交到当前页面的url

在函数开始时使用e.preventDefault()，然后进行计算

同样在您的代码中，您已经为input 变量一一分配了所有值，那么accessories 变量将如何具有您想要的值？？？