【问题标题】:AngularJS validation with ng-pattern works in desktop browser but not mobile使用 ng-pattern 的 AngularJS 验证适用于桌面浏览器,但不适用于移动设备
【发布时间】:2015-02-16 11:32:33
【问题描述】:

我编写了一个非常简单的正则表达式来确保某些用户输入是带有单个空格的字母数字,如下所示:

        <input type="text" ng-minlength="5" ng-maxlength="8" ng-pattern="/^[0-9A-Z]*\s[0-9A-Z]*$/gi" required   placeholder="Postcode" ng-model="addr.postcode"  class="form-control" name="postcode" />
        <div class="col-xs-12" ng-messages="myform.postcode.$error" ng-if="myform.$submitted || myform.postcode.$dirty">
            <div class="text-warning" ng-message="minlength">Postcode is too short.</div>
            <div class="text-warning" ng-message="pattern">Must contain a space.</div>
            <div class="text-warning" ng-message="maxlength">Postcode is too long.</div>
        </div>

当我在桌面上的 chrome 中测试它时,它很有魅力。如果我的输入不包含空格,我会收到验证错误。当我输入空格时,错误就会清除。例如,“AB12 3CD”通过,“AB123CD”失败,正如我所料。

如果我在移动设备上打开相同的页面(我已经使用 iPhone 5 和 6 以及 Windows Phone 8.1 进行了测试),无论输入如何,该模式总是会失败。例如“AB12 3CD”和“AB123CD”都失败了。

【问题讨论】:

  • 应该没什么区别。但是您可能希望在开头使用 ^ 并在结尾使用 $ 包装您的正则表达式,以确保您测试整个输入
  • 我尝试按照建议使用 ^ 和 $ 进行锚定,但没有区别。正则表达式适用于桌面,但不适用于移动设备。

标签: javascript regex angularjs mobile


【解决方案1】:

这是全局 g 选项。如果我将正则表达式更改为

ng-pattern="/^[0-9A-Z]*\s[0-9A-Z]*$/i"

它适用于移动版和桌面版

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-07-22
    • 1970-01-01
    • 2020-02-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多