1

我正在使用 jQuery Mask 插件，我之前使用过很多次，但现在我必须为生产版本使用它，我似乎无法正确屏蔽电话号码输入，我可以(11) 1111-1111毫无问题地输入，但它不会让我添加另一个数字，如果我确实添加了另一个数字，它应该将掩码更改为(11) 1 1111-1111. 这是在每个网站（包括这个）上都可以找到的相同示例。

$().ready(() => {
  var moptions = {
    placeholder: "(__) ____-____",
    onKeyPress: function(cep, e, field, options) {
      var masks = ["(00) 0000-0000", "(00) 0 0000-0000"];
      var mask = cep.length > 14 ? masks[1] : masks[0];
      $(".phone").mask(mask, options);
    }
  };

  $(".phone").mask("(00) 0000-0000", moptions);
});
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.16/jquery.mask.min.js"></script>
<input type="text" class="phone"/>

4

1 回答 1

2

这里的主要问题是您试图检测字符串的长度，但是当您切换掩码时，您会引入两个额外的字符'0 '，这会影响要使用的字符数。

您可能会考虑忽略非数字字符，这将使您更好地了解要使用哪个掩码，这样掩码不会干扰您的计数，使用如下示例：

$().ready(() => {
  var maskOptions = {
    placeholder: "(__) ____-____",
    onKeyPress: function(cep, e, field, options) {
      // Use an optional digit (9) at the end to trigger the change
      var masks = ["(00) 0000-00009", "(00) 0 0000-0000"],
        digits = cep.replace(/[^0-9]/g, "").length,
        // When you receive a value for the optional parameter, then you need to swap
        // to the new format
        mask = digits <= 10 ? masks[0] : masks[1];

      $(".phone").mask(mask, options);
    }
  };

  $(".phone").mask("(00) 0000-0000", maskOptions);
});
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.16/jquery.mask.min.js"></script>
<input type="text" class="phone" />

于 2019-12-12T17:52:34.477 回答