jquery根據值長度更改輸入掩碼模板

Question

我無法弄清楚如何根據值長度更改輸入模板掩碼。

例如：我有兩個車號模板'99-999-99'和'999-99-999'。我需要根據值長度更改輸入掩碼。

如果值長度爲7或更小，模板必須爲'99-999-99'。如果數值長度大於7，那麼聖殿必須是'999-99-999'。

我的代碼：

$("#carnum").keyup(()=>{ 
    var masks = ['99-999-99', '999-99-999']; 
    var value = $('#carnum').val().replace(/-/g, ''); 
    value.length <= 7 ? -1 : $('#carnum').mask(masks[1]); 
}) 
$("#carnum").mask('99-999-99'); 

這裏是fiddle。

謝謝！

Answer 1

之前再次掩蔽相同的元件是揭露它最佳實踐， 這裏用於動態地或有條件地改變掩模

var changeMask=0; 
$("#carnum").keyup(()=>{ 
    var masks = ['99-999-99', '999-99-999']; 
    var value = $('#carnum').val().replace(/-/g, '').replace(/_/g,''); 
    if(value.length==7){ 
    changeMask++; 
    } 
    if(changeMask>1&&value.length>=7) { 
    $('#carnum').unmask(masks[0]); 
    $('#carnum').mask(masks[1]); 
    var arrayValue=value.split(""); 
    $("#carnum").val(""); 
    for(var index=0;index<arrayValue.length;index++){ 
    $("#carnum").val(function(i, val) { 
     return val + arrayValue[index]; 
    }).trigger('input'); 
    } 
    } 
}) 
$("#carnum").mask('99-999-99'); 

Working fiddle here

示例代碼參考