Javascript不写元素的innerHTML而是闪烁结果？

Question

在这个简单的程序中，脚本不会写入result id="result"，而只是刷新结果值。有谁能看一看并说明为什么会出现这种行为？我做错了什么？

​

function multiplication() {
  var product,
    no1 = document.getElementById('no1').value,
    no2 = document.getElementById('no2').value;

  product = no1 * no2;
  document.getElementById("result").innerHTML = product;
}

function division() {
  var divis,
    no1 = document.getElementById('no1').value,
    no2 = document.getElementById('no2').value;

  divis = no1 / no2;
  document.getElementById("result").innerHTML = divis;
}

 <h2>Write a JavaScript program to calculate multiplication and division of two numbers ?</h2>
<h3>Sample Form</h3>
<form name="sample" method="POST">
  1st Number:
  <input type="text" id="no1" name="firstno" />&nbsp;&nbsp;&nbsp;&nbsp; 2nd Number:
  <input type="text" id="no2" name="secondno" />
  <button id="mul" onclick="multiplication();">Multiply</button>
  <button id="div" onclick="division();">Division</button>
</form>
<p id="result"></p>

​

Answer 1

1. 单击提交按钮
2. JavaScript runs
3. The form is submitted
4. 将加载新页面

<代码>G29

新页面没有旧页面上的DOM更改。

或者阻止“提交”按钮的默认行为，或者将事件处理程序绑定到其他类型的控件。

Answer 2

您的JS正在运行，但是当用户单击submit按钮时，表单也会被提交，因为这是默认操作。

阻止表单提交。

<form onsubmit="event.preventDefault();" name="sample" method="POST">

Answer 3

<button type="button" id="mul" onclick="multiplication();">Multiply</button>
<button  type="button" id="div" onclick="division();">Division</button>

这可能会对你有帮助。