jQuery Masked插件的問題

Question

這是我的面具領域：

$('#Cellphone').mask("(99)9999-9999?9", { placeholder: " " });

1. 當我的輸入失去焦點時，我想清除面具。 有辦法嗎？ 像插件的選項...

    $('#Cellphone').mask("(99)9999-9999?9", { placeholder: " ", clearOnLostFocus: true }); 

   或者進入模糊功能：

    $('#Cellphone').blur(function() { // clear the mask here. }); 

2. 我想動態更改我的面具。 我正在使用這個功能，效果很好......

    $('#Cellphone').keyup(function () { var newValue = $(this).val() .replace("(", "") .replace(")", "") .replace(" ", "") .replace("-", "") .replace("?", ""); if (newValue.length > 10) { $(this).mask("(99)9-9999-9999", { placeholder: " " }); } }); 

   但是 ......當我按下退格鍵並選擇了該字段的內容時，我的面具停止工作。 知道為什么會這樣嗎？

感謝大伙們！

Answer 1

如果未正確填充蒙版， clearOnLostFocus選項將起作用。 即如果你還沒有輸入所有數字，那么保留輸入，它將清除它。

$('#cellphone').mask("(99)9999-9999?9", { placeholder: " ", clearOnLostFocus: true });

如果您希望輸入字段在失去焦點時為空白， 即使字段內的數字與蒙版匹配，則您需要使用blur事件。 在事件回調中，清空該字段，然后重新應用輸入掩碼：

$("#cellphone").blur(function() {
   $(this).val(""); 
   $(this).mask("(99)9999-9999?9", { placeholder: " " });
});

退格或刪除導致問題的原因是因為插件試圖將新掩碼應用於不正確的文本行。 因此，在您的鍵盤功能中，您需要檢查新掩碼是否到位（輸入字段的長度是15）以及按下的鍵是退格鍵（代碼= 8）還是刪除鍵（代碼= 46）。 如果是這樣，那么你需要重新應用舊的面具。

$('#cellphone').keyup(function (event) {
    if ($(this).val().length > 14 && ((event.keyCode == 8)||(event.keyCode == 46))) {
        $(this).mask("(99)9999-9999?9", { placeholder: " " });
    } else {
            var newValue = $(this).val()
                .replace("(", "")
                .replace(")", "")
                .replace(" ", "")
                .replace("-", "")
                .replace("?", "");

            if (newValue.length > 10) {
                $(this).mask("(99)9-9999-9999", { placeholder: " " });
            }
    }
});

JSFiddle在這里提供了以上所有內容。