Javascript 该函数在单击按钮时起作用，但在提交表单时不起作用

我还有一个关于这个项目的问题，但希望我能从中学到很多

所以我创建了一个函数，它在一个div中创建一个div（它将包含骰子掷骰中的一个随机数），当我将这个函数添加到一个按钮点击中时，它就会工作

但是多次点击按钮可能不适合很多骰子，所以我创建了一个表单，它不应该创建用户决定想要的div数，但它似乎不起作用。我怀疑这与刷新页面的表单有关，因此我使用内联“onsumbit”并尝试返回函数，而不是处理eventwithh addEventListener，但它似乎仍然不起作用。我做错了什么？以下是HTML和JS代码：

    <form>
    <p>Pick how many dice you want to roll:</p>
    <input id="diceNumber" type="number" name="diceNumber" onsubmit="return addMoreDice()">
</form>

<button onclick="addDice()">Add Dice</button>

<div id="diceTable">

</div>

选择要掷多少骰子：

加骰子

和JS：

var numInput = document.querySelector("input");

function addDice(){
var div = document.createElement('div');

div.className = "diceStyle";

div.innerHTML = "<p> here will be a dice</p>";

document.getElementById('diceTable').appendChild(div);
};

function addMoreDice(){
for(var i = 0; i < numInput; i++){
    addDice();
    }
}

var numInput=document.querySelector（“输入”）；
函数addDice（）{
var div=document.createElement（'div'）；
div.className=“diceStyle”；
div.innerHTML=“这里将是一个骰子”
”；
document.getElementById（'diceTable'）.appendChild（div）；
};
函数addMoreDice（）{
对于（变量i=0；i

1.您可能应该在表单标记中包含onsubmit（），并在表单中添加一个submit按钮

无论何时更改输入框中的值，都可以使用onchange（）方法调用addMoreDice（）

您需要在side-form标记中添加onsubmit=“yourfunction（）” 然后将输入类型submit放入表单标记中，如

    <form action="#" onsubmit="addDice()">
    <p>Pick how many dice you want to roll:</p>
    <input id="diceNumber" type="number" name="diceNumber" onsubmit="return addMoreDice()">
    <input type="submit" value="Submit">
</form>

<button onclick="addDice()">Add Dice</button>

<div id="diceTable">

</div>

选择要掷多少骰子：

加骰子

每次提交表单时，都会进入不同的页面。相反，您可以使用如下所示的代码（删除表单标记）

选择要掷多少骰子：

---

输入输入后单击submit可根据需要动态创建分区

提交表格的目标在哪里<代码>仍然不起作用，我可以看到一个单div在消失前的一瞬间出现，但当我使用addMoreDice（）时，我甚至看不到它，然后它只能通过鼠标单击和AddDice（）函数工作。也许，但我不知道为什么，我的addMoreDice（）函数在单击提交按钮时不起作用，它与addMoreDice函数一起起作用。尝试在文本框中输入数值，然后单击“提交”。我试过了，成功了

<p>Pick how many dice you want to roll:</p>
<input id="diceNumber" type="number" name="diceNumber"></input>
<input type="submit" onClick="addMoreDice()">