能否配置必填字段忽略空格？

Question

能否配置必填字段忽略空格？

50

HTML5中的required属性非常方便：

<input type="text" required>

但它仍然允许用户只输入空格，是否有纯HTML的解决方案？

- BenMorel

4个回答

14

尝试使用 pattern 属性。您需要一个至少指定一个字符的正则表达式。

- robertc

1

你可能想要使用\S来禁止所有空格。 - LiberalArtist

3

你可能需要这个：

<input type="text" required pattern="\S(.*\S)?">

（至少一个非空格字符且输入内容开头和结尾没有空格）

或者如果内容开头和结尾可以包含空格，则为：

<input type="text" required pattern=".*\S.*">

- Jeremy Moritz

0

步骤1

创建一个Javascript函数：

function ignoreSpaces(event) {
  var character = event ? event.which : window.event.keyCode;
    if (character == 32) return false;
}

步骤二

在HTML的任何文本输入字段中使用它。

<input type="text" id="userInput" onkeypress="return ignoreSpaces(event)">

工作示例：

index.html

<html> 
<body>
  <input type="text" onkeypress="return ignoreSpaces(event)">
  
  <script>
    function ignoreSpaces(event) {
        var character = event ? event.which : window.event.keyCode;
        if (character == 32) return false;
    }
  </script>

</body>
</html>

- S007

2

但我可以粘贴空格 - Alex78191

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- James Messinger · Accepted Answer

使用pattern属性与required属性相结合。还要确保包含一个title属性，因为大多数浏览器将标题文本插入验证弹出气泡中。

<input required pattern=".*\S+.*" title="This field is required">

.*\S+.*模式要求至少有一个非空格字符，但也允许在开头或结尾使用空格字符（空格、制表符、回车等）。如果您不希望用户能够在开头/结尾放置空格，则改用以下内容：

<input required pattern="\S(.*\S)?" title="This field is required">