0

我已经设置,需要实现三个单独的目标:

  1. 客户端验证(这是使用 jQuery Validate 插件完成的)
  2. 整洁的数字格式(这是使用 jQuery autoNumeric 插件完成的)
  3. iPad/iPhone 键盘在纯数字字段上弹出(这是使用输入元素上的 pattern="[0-9]*" 属性完成的 - 我不能使用 HTML5 type="number",因为 autoNumeric 插件不支持它) .

问题是,虽然它有效,但 validate 插件会引发浮点值错误(无效格式),因为小数点分隔符与 pattern="[0-9]*" 正则表达式不匹配。请在下面找到一个示例输入字段:

<input type="text" id="acme" name="acme" size="4" 
 data-autonumeric="{vMin: '0.00'}" class="required number autoNumeric" 
 min="0.0" step="0.01" pattern="[0-9*]">

有没有办法以某种方式禁用模式验证,最好在全局范围内,对所有已验证的字段,或者每个字段?或者也许还有另一种方法可以在 iPad/iPhone 上强制使用数字键盘,这并不意味着 type="number" 或 pattern="[0-9*]"?

编辑:

我找到了解决此问题的方法,请参阅下面的答案。如果有人有更好的想法,请分享。谢谢你。

4

1 回答 1

1

我通过覆盖 jQuery Validate 中的模式验证方法找到了一种方法。如果有人知道更好的解决方案,请发表评论。

这是代码。它与添加的 jQuery.validator.addMethod("pattern" ... \d ”,我使用(来源http://developer.apple.com/library/ios/#documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html)。注释掉该行以查看实际问题。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/additional-methods.min.js"></script>
<script type="text/javascript" src="jquery.metadata.js"></script>
<script type="text/javascript" src="autoNumeric-1.7.4.js"></script>
<form id="test">
<input type="text" id="acme" name="acme" size="4" data-autonumeric="{vMin: '0.00'}"
    class="required number autoNumeric" min="0.0" step="0.01" pattern="\d*" value="1.00">
</form>
<script type="text/javascript">
    $(document).ready(function () {
        $("#test").validate();
    });

    // This overrides the additional-methods.min.js implementation to ignore pattern="\d*" validation
    jQuery.validator.addMethod("pattern", function (e, t, n) {
        return this.optional(t) || n == "\\d*" ? !0 : (typeof n == "string" && (n = new RegExp("^(?:" + n + ")$")), n.test(e))
    }, "Invalid format.");
</script>
于 2013-02-20T08:34:49.037 回答