社会安全号码输入validation

我有这个样本:

链接

代码HTML:

 

代码CSS:

 .valid{ border:1px solid blue; } .invalid{ border:1px solid red; } 

代码JS:

 function ssnFormat(){ $("#ssn").on('blur change', function () { text = $(this).val().replace(/(\d{3})(\d{2})(\d{4})/, "$3-$2-$4"); if ($(this).val() == '' || $(this).val().match(text) || $(this).val().length == 0) { $(this).removeClass('valid').addClass('invalid'); }else { $(this).removeClass('invalid').addClass('valid'); } }); } $( "#ssn" ).on('blur change', function() { ssnFormat(); }); 

我想做的是这些:

1.如果我写下面的文字,我想validation这种格式123-12-1234

2.如果我写123456789我想在以这种格式点击外部输入时进行转换

 123-12-1234 

我尝试使用下面的函数执行此操作但不起作用

 $("#ssn").on("click", function() { var thisVal = $(this).val(); var value = thisVal.replace(/[^\/\d]/g,''); //here is a problem $(this).val(value); }); 

你能帮我解决一下这个问题吗?

提前致谢!

试试这个

 function myFunc() { var patt = new RegExp("\d{3}[\-]\d{2}[\-]\d{4}"); var x = document.getElementById("ssn"); var res = patt.test(x.value); if(!res){ x.value = x.value .match(/\d*/g).join('') .match(/(\d{0,3})(\d{0,2})(\d{0,4})/).slice(1).join('-') .replace(/-*$/g, ''); } } 
 .valid{ border:1px solid blue; } .invalid{ border:1px solid red; } 
  
 function myFunc() { var patt = new RegExp("\d{3}[\-]\d{2}[\-]\d{4}"); var x = document.getElementById("ssn"); var res = patt.test(x.value); if(!res){ x.value = x.value .match(/\d*/g).join('') .match(/(\d{0,3})(\d{0,2})(\d{0,4})/).slice(1).join('-') .replace(/-*$/g, ''); } } 
 .valid{ border:1px solid blue; } .invalid{ border:1px solid red; }