Question

我有一个非常简单的html，带有div信息消息和带有两个按钮的表单（实际上有两个输入类型提交和重置）

div #info动态填充（ajax）。在JavaScritpt中，我等待窗口加载，并为onreset事件注册重置输入：

window.addEventListener("load", onloadWindow);

function onloadWindow() { 
  // Document loaded, register onreset event for my form
  document.getElementById("formId").addEventListener("onreset", onresetForm);
}

// Reset al the infos
function onresetForm(event) {
  document.getElementById("formId").reset();
  document.getElementById("info").innerHTML = '';
}

<body>
  <div id="info"></div> 
  <form id='formId' action='#' method='post'>
    <label for='cod'>Code:</label>
    <input id='cod'  type='text'   name='cod'><br>
    <label for='desc'>Description:</label>
    <input id='desc' type='text'   name='desc'><br>
    <label for='type'>Type:</label>
    <input id='type' type='text'   name='type'><br>
    <input id='upd'  type='submit' name='upd' value='Update'>
    <input id='res'  type='reset'  name='res' value='Reset'>
  </form>
</body>

表单中的所有文本字段都已清除，但div＃info的innerHTML = ''不起作用，ajax生成的以前的消息不会被删除。我在这里错过了什么吗？

顺便说一下，我正在使用Smarty模板作为表单，但我不认为这与我的问题有关

Answer 1

事件类型/名称只是reset，而不是onreset。然后在重置回调中，您不需要再次重置表单。

window.addEventListener("load", onloadWindow);

function onloadWindow() { 
  // Document loaded, register onreset event for my form
  document.getElementById("formId").addEventListener("reset", onresetForm);
}

// Reset al the infos
function onresetForm(event) {
  document.getElementById("info").innerHTML = 'form has been reset';
}

<body>
  <div id="info">Info before reset</div> 
  <form id='formId' action='#' method='post'>
    <label for='cod'>Code:</label>
    <input id='cod'  type='text'   name='cod'><br>
    <label for='desc'>Description:</label>
    <input id='desc' type='text'   name='desc'><br>
    <label for='type'>Type:</label>
    <input id='type' type='text'   name='type'><br>
    <input id='upd'  type='submit' name='upd' value='Update'>
    <input id='res'  type='reset'  name='res' value='Reset'>
  </form>
</body>

innerHTML不适用于事件处理程序

1 个答案: