Question

在这个假设的页面中，我有这些输入：

<input type="number" min=1 max=9 required />
<input type="number" min=1 max=9 required />
<input type="number" min=1 max=9 required />
<input type="number" min=1 max=9 required />

令我困惑的是，我知道如果我将输入放在表格中并提交表格，他们就会受到限制。

但如果你去小提琴：Fiddle

您可以轻松输入100或-20或1-9范围外的任何内容。

有没有办法在输入字段时限制输入字段中的值？ /不提交

（附带问题：输入字段的min / max属性何时生效？是否仅在提交表单时？是否可以在不提交表单的情况下验证值？）

Answer 1

当您在表单上使用提交按钮时， Google Chrome 似乎会强制执行最小/最大值。

我已经使用3个提交按钮（相应地标记）更新了您的示例...一个将执行验证，其他人将显示错误，但仍然提交。

http://jsfiddle.net/uatxcvzp/12/

 <form>
    <input type="number" min="1" max="9" required />
    <input type="number" min="1" max="9" required />
    <input type="number" min="1" max="9" required />
    <input type="number" min="1" max="9" required />
    <br/>
    <br/><input type="button" value="Submit With No Forced Validation" onclick="this.form.submit();"/>
    <br/><input type="submit" value="Submit With No Forced Validation" onclick="this.form.submit();"/>
    <br/><input type="submit" value="Submit With Forced Validation"/>
</form>

在 Firefox 中，验证发生在字段模糊处，突出显示红色的字段边框并显示工具提示，说明悬停时的错误。使用任一提交样式将停止并要求修复错误。

在 IE10 中，当您尝试提交表单时，只有原生提交按钮会强制进行验证。

在iOS9.1上的 Safari 中，无论使用何种提交按钮/代码样式，它都会被完全忽略。： - （

Answer 2

试试这个：

＆＃13;

$("input[type='number']").change(function() {
  var $this = $(this);
  var val = $this.val();
  var span = $(".error");
  if (val > 9 || val < 1) {
    
    span.text("value must be between 1 and 9");
  }else{
   span.text("");
  }
});

＆＃13;

input {
  width: 40px;
  height: 40px;
  font-size: 1.4em;
}
.error {
  color: red;
  font-style: italic;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<input type="number" min=1 max=9 required />
<input type="number" min=1 max=9 required />
<input type="number" min=1 max=9 required />
<input type="number" min=1 max=9 required />
<span class="error"></span>

＆＃13;

Answer 3

这是我的工作对我来说

<input type="text" name="number" minlength='1' maxlength="9" required>

Answer 4

您可以尝试以下代码：

Failed to get a pseudo terminal: Permission denied

在输入时限制HTML输入字段中的值？

4 个答案: