Question

我创建了一个简单的表单，在该表单中，我希望“名字”字段仅允许字母（小写和大写）和空格。我使用了以下模式：

pattern="[a-zA-Z ]*"

这似乎可行，但是我也尝试了pattern="[a-zA-Z ]"，但失败了。

pattern="[a-zA-Z ]*"代码是否符合此要求的正确正则表达式，还是允许其他一些字符？如果是这样，您为什么需要星号？我已经看到其他类似的正则表达式没有星号，这使我相信除了我的要求以外，还有一些可以输入的字符。

我实际上找不到在任何地方解释正则表达式的地方，例如博客文章，另一个堆栈溢出帖子，视频或任何能准确教授正则表达式的东西，如果有人写过任何有关正则表达式的内容，我将不愿阅读。感谢您的任何帮助

Codepen网址：https://codepen.io/anon/pen/rgvyjq

function showEmailError() {
  let emailError = $('#email-error');
  
  emailError.fadeIn('slow');
  emailError.text('Please enter a valid email address');
  
  setTimeout(() => emailError.fadeOut('slow'), 3000);
}

form {
  background: #f0f0f0;
  padding: 25px;
  border-radius: 5px;
  display: flex;
  flex-flow: row wrap;
}
form input, form label, form textarea { flex-basis: 100% }
form label { padding-bottom: 5px }
form input { padding: 5px }
form input:not(:last-of-type) , form textarea { margin-bottom: 15px }
form textarea { min-height: 50px }
form button {
  padding: 10px 15px;
  margin-top: 20px;
  font-size: 0.8em;
  border: 1px solid #ccc;
}
#email-error {
  background: #FB5835;
  flex-basis: 100%;
  padding: 10px;
  display: none;
}

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<form method="post">
  <label for="forename">* First Name:</label>
  <input type="text" id="forename" name="first-name" required="required" minlength="2" maxlength="20" pattern="[a-zA-Z ]*" oninvalid="setCustomValidity('Invalid Forename')" oninput="setCustomValidity('')">

  <label for="surname">Last Name:</label>
  <input type="text" id="surname" name="last-name">

  <label for="address">Addess:</label>
  <textarea type="text" id="address" name="address"></textarea>

  <label for="country">Country:</label>
  <input type="text" id="country" name="country">

  <label for="postcode">Postcode:</label>
  <input type="text" id="postcode" name="postcode">

  <label for="phone">Phone:</label>
  <input type="text" id="phone" name="phone">

  <label for="email">* Email:</label>
  <span id="email-error">Error</span>
  <input type="text" id="email" name="email" required="required" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$" oninvalid="showEmailError()">

  <button type="submit">Submit</button>
</form>

Answer 1

正则表达式中的*表示0或不限数量。它将不允许您的正则表达式[a-zA-Z ]*中包含其他字符，但将允许包含空字符串。

要要求至少一个大写，小写，空格字符，但不包含数字或符号，则可以使用[a-zA-Z ]+

-

这里是一个可以帮助解释和输入正则表达式的网站。您会在这里看到基于编程语言的一些细微变化。

https://regex101.com/

这是一个系统地教他们的网站。

https://regexone.com/

Answer 2

因为[a-zA-Z ]仅传递一个字符，例如a，所以这可能是为什么我们使用[a-zA-Z ]*，[a-zA-Z ]+或{{1} }，如果在这里我们只希望将[a-zA-Z\s]+上下和 space 传递一次以上。

RegEx电路

jex.im可视化正则表达式：

简单正则表达式仅适用于空格以及大写和小写字母

2 个答案:

RegEx电路