输入验证Javascript

Question

在Windows 8 Javascript应用程序中，我试图验证用户的输入并在用户按下Apply后使用以下内容将结果保留在屏幕上：

<form>
  <input id="test" type="number" min="1" max="10" />
  <button id="button" type="button">Apply</button>
</form>

但是当我点击Apply时，验证不起作用。仅当我将type="button"替换为type="submit"时，它才有效。问题是提交刷新页面，结果消失。我该怎么办？

以下是我正在尝试做的一个示例：JSFiddle

更新

我将代码更改为：

<buton id="button" type="submit" onsubmit="doTest(); return false;">Apply</button>

但它仍会刷新我的页面。

Answer 1

在onSubmit事件触发之前，表单验证不会触发，行为与设计完全相同。

您可以做的一件事是将for设置为“onSubmit”事件，将按钮更改为提交类型，然后在onSubmit函数中调用event.stopPropigation以阻止页面执行完整的回发。