使用html5表单中的多个模式进行验证

Question

我在表格中要求输入...我的有效值是数字或“No Min”或“No Max”。现在我可以使用模式的字符串值或数字但不是两个...我的问题是如何在html 5输入标签中使用多个模式...我也在使用jQuery ...

 <form id="form_searchProperty"  >
  <div class="criteria_block">
   <span><label class="search_form_Label" for="propbath">Bathroom</label></span>
     <span>
          <input id="input_propbath_min" value="No Min" pattern ="\d+" name="Min_Bathrooms" style="width:75px;"/>
          <input id="input_propbath_max" value="No Max" pattern ="\d+" name="Max_Bathrooms" style="width:75px;" />
      </span>
    </div>
  </form>

Answer 1

您可以使用OR（|）运算符。

pattern="(No M(in|ax))|\d+"

Answer 2

由于您的模式是正则表达式，因此您的正则表达式模式可以包含其中一个/或其中：

<input pattern ="(\d+)|(No Min)">

Answer 3

您可以使用正则表达式测试而不是input元素的pattern属性。

看到这个：

<script src="jquery-1.8.0.min.js"></script>
<script>
$(function(){

    $('form#form_searchProperty').submit(function(){
        var pat1 = /\d+|no min/i, pat2 = /\d+|no max/i;
        if (!pat1.test($('#input_propbath_min').val()) && !pat2.test($('#input_propbath_min').val()))
        {
            return false;
        }
    });

});
</script>

<form id="form_searchProperty"  >
    <div class="criteria_block">
        <span><label class="search_form_Label" for="propbath">Bathroom</label></span>
        <span>
            <input id="input_propbath_min" value="No Min" name="Min_Bathrooms" style="width:75px;"/>
            <input id="input_propbath_max" value="No Max" name="Max_Bathrooms" style="width:75px;" />
        </span>
    </div>
    <input type="submit" >
</form>

Answer 4

你可以使用这种格式

<input type="text" pattern="10453|10457" />

使用|添加任意数量的数字标志。