首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >防止HTML输入中出现前导空格的正则表达式模式

问防止HTML输入中出现前导空格的正则表达式模式
EN

Stack Overflow用户
提问于 2018-06-14 13:09:09
回答 3查看 115关注 0票数 0

​

代码语言:javascript
复制
<input type="text" pattern="^[a-zA-Z1-9].*">

​

我如何才能限制下面的输入元素有前导空格,即它应该总是以除空格以外的字符开头。

​

This answer建议我使用pattern="^[a-zA-Z1-9].*",但它似乎不起作用。

编辑:

只有当我把它包装在一个表单标签和一个提交按钮中时,它才能起作用。单击该按钮将触发错误。但我希望能够限制用户在输入框中输入空格。

EN

回答 3

Stack Overflow用户

发布于 2018-06-14 13:24:47

为了在没有表单标签的情况下实现这一点,我们可以使用JavaScript实时输入过滤器,如下所示:

​

代码语言:javascript
复制
var noLeadingSpace = /^\w.*$/;

$("input")
  .data("oldValue", "")
  .bind("input propertychange", function() {
    var $this = $(this);
    var newValue = $this.val();

    if (!noLeadingSpace.test(newValue))
        return $this.val($this.data("oldValue"));

    return $this.data("oldValue", newValue);
  });
代码语言:javascript
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" />

​

票数 1
EN

Stack Overflow用户

发布于 2018-06-14 13:14:55

它确实可以工作,但如果您尝试发送表单,则会对其进行验证。

​

代码语言:javascript
复制
function myValidator(v){
  var input = document.getElementById('uglyWay')
  
  if(input){
    input.value = input.value.replace(/ /g, '')
  }
}
代码语言:javascript
复制
<form>
<input id="uglyWay" oninput='myValidator()' type="text" pattern="^[a-zA-Z1-9].*">
<button type="submit">Send</button>
</form>

​

票数 0
EN

Stack Overflow用户

发布于 2018-06-14 16:27:59

下面提到的正则表达式在不包装form标记的情况下可以正常工作

​

代码语言:javascript
复制
input[type="text"]:valid{
background:green;
}
input[type="text"]:invalid{
background:red;
}
代码语言:javascript
复制
<input type="text" pattern="^[a-zA-Z1-9].*">

​

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50849968

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档