Question

我无法弄清楚我的onsubmit事件有什么问题：当我按提交时 - 没有发生。当我将cols和row直接放在函数show table中时，它可以工作。这是codepen http://codepen.io/Y-Taras/pen/VaaBgy

的链接

 window.onload = function() {
   document.getElementById("show").onsubmit = function() {
     var cols = document.getElementById("cols").value;
     cols = parseInt(cols);
     var rows = document.getElementById("rows").value;
     rows = parseInt(rows);
     showTable(rows, cols);
     console.log(rows, cols);
   };

   function showTable(rows, cols) {....

 window.onload = function() {
   document.getElementById("show").onsubmit = function() {
     var cols = document.getElementById("cols").value;
     cols = parseInt(cols);
     var rows = document.getElementById("rows").value;
     rows = parseInt(rows);
     showTable(rows, cols);
     console.log(rows, cols);
   };

   function showTable(rows, cols) {
     var elem = "<table>";
     for (var i = 1; i < rows + 1; i++) {
       elem += "<tr>";
       for (var j = 1; j < cols + 1; j++) {
         elem += "<td> " + i * j + "</td>";
         if (j === cols) {
           elem += "</tr>";
         }
       }
     }
     elem += "</table>";
     document.getElementById("table").innerHTML = elem;
   }
 };

<div>
  <h1>javascript</h1>
  <br>
  <p>Multiplication Table</p>
  <hr/>
  <form>
    Number of rows:
    <input type="text" id="rows" name="rows">Number of cols:
    <input type="text" id="cols" name="cols">
    <input id="show" type="submit" value="Submit">
  </form>
</div>
<div id="table"></div>

Answer 1

如果您想使用onsubmit事件，则必须有表单，因此请在html中添加表单标记，以涵盖所有输入。

<form id="form">
    <input type="text" id="rows" name="rows">Number of cols:
    <input type="text" id="cols" name="cols">
    <input id="show" type="submit" value="Submit">
</form>

将onsubmit事件的ID更改为表单的ID，并将return false添加到onsubmit中代码的末尾，如下所示：

document.getElementById("form").onsubmit = function() {
    // ......
    // your code above

    return false;
}

单击提交按钮后，这将阻止页面刷新。

希望有所帮助。

Answer 2

在你的代码片段中，“show”是一个按钮，而不是一个表单。因此，您需要使用“onclick”而不是“onsubmit”。

Answer 3

问题在于输入的类型，它必须是一个＆＃34;按钮＆＃34;不是＆＃34;提交＆＃34;！

为什么我的乘法表没有显示？

3 个答案: