语义 UI 表单验证正则表达式将不匹配 mm/dd/yyyy 日期

Question

我正在尝试验证文本框的文本输入以仅允许 mm/dd/yyyy 输入。根据正则表达式测试器，正则表达式似乎对我尝试匹配的内容有效。

是什么导致它失败，我该如何修复它？

正则表达式：(0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])[- /.](19|20)\d\d

正则表达式测试：http://www.regextester.com/?fam=93828

JSFiddle：https://jsfiddle.net/tL5xx6m9/2/

片段：

$('.ui.form').form({
  inline: true,
  fields: {
    dateInput: {
      identifier: 'dateInput',
      rules: [{
        type: "regExp[/(0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])[- /.](19|20)\d\d/]",
        prompt: "Please select a valid mm/dd/yyyy date"
      }]
    },
    timeInput: {
      identifier: 'timeInput',
      rules: [{
        type: "regExp[/^(OFF)|([0-1]?[0-9]|2[0-3]):[0-5][0-9](:[0-5][0-9])? [APap][mM]$/]",
        prompt: "Please select a valid hh:mm AM/PM time"
      }]
    }
  }
});

<script src="https://cdn.jsdelivr.net/jquery/2.1.4/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"></script>


<form class="ui form attached fluid segment">
  <div class="field">
    <input name="dateInput" value="01/15/2015" type="text" placeholder="Entry Date">
  </div>
  <div class="field">
    <input name="timeInput" class="field-custom" value="5:30 PM" type="text" id="" placeholder="Entry Time">
  </div>
  <button class="ui teal button" type="submit">Submit</button>
</form>

Answer 1

因为您的正则表达式是 javascript 字符串的一部分，所以任何反斜杠都需要使用双反斜杠进行转义。所以 \d 变成 \d.

此外，使用字符串开头 ^ 和字符串结尾 $ 标记来防止来自较大字符串的匹配，例如 01/15/20155，成功。

结果：

type: "regExp[/^(0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])[- /.](19|20)\d\d$/]",

片段：

$('.ui.form').form({
  inline: true,
  fields: {
    dateInput: {
      identifier: 'dateInput',
      rules: [{
        type: "regExp[/^(0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])[- /.](19|20)\d\d$/]",
        prompt: "Please select a valid mm/dd/yyyy date"
      }]
    },
    timeInput: {
      identifier: 'timeInput',
      rules: [{
        type: "regExp[/^(OFF)|([0-1]?[0-9]|2[0-3]):[0-5][0-9](:[0-5][0-9])? [APap][mM]$/]",
        prompt: "Please select a valid hh:mm AM/PM time"
      }]
    }
  }
});

<script src="https://cdn.jsdelivr.net/jquery/2.1.4/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"></script>


<form class="ui form attached fluid segment">
  <div class="field">
    <input name="dateInput" value="01/15/2015" type="text" placeholder="Entry Date">
  </div>
  <div class="field">
    <input name="timeInput" class="field-custom" value="5:30 PM" type="text" id="" placeholder="Entry Time">
  </div>
  <button class="ui teal button" type="submit">Submit</button>
</form>

语义 UI 表单验证正则表达式将不匹配 mm/dd/yyyy 日期

Semantic UI Form Validation RegEx will not match a mm/dd/yyyy date

javascript

regex

validation

semantic-ui