屏蔽社会安全号码输入 [英] Masking a social security number input

问题描述

对于Web应用程序，我构建隐私非常重要，用户输入数据的格式也是如此。

为了帮助解决这个问题，我已经插入了一个jquery库这将有助于掩盖字段 http://igorescobar.github.io/jQuery-Mask-Plugin/

但是，我似乎无法掩盖社会安全号码。例如，格式很好地通过567-78-7890，但我似乎无法弄清楚如何掩盖或隐藏前四个数字......如 * - -7890。 / p>

我的html只是一个输入字段

 < input class = 'social'/> 
  

使用此插件我尝试将其屏蔽为

  $（'。social'）。mask（'000-00-0000'）; 
  

这只是提供格式

  $（ newsocial。 '）掩模（' XXX-XX-0000' ）; 
  

这只会替换他们用x输入的数字。

我还设置了一个jsFiddle帮助
http://jsfiddle.net / w2sccqwy / 1 /

任何帮助都会很棒！

PS我不能使用密码字段，因为必须向用户显示最后四个数字，并且我不能有多个字段。这是公司的要求。我不能像我想的那样改变公司的要求。

解决方案

对于任何可能在未来遇到这种情况的人我都是能够找出一个能够掩盖任何类型字段并将其格式化而不会搞乱任何其他插件的解决方案。

在html中你需要两个输入

 < input class ='number'/> 
< input class ='value'/> 
  

然后将数字字段放在价值上

然后在你的javascript中

  $（'。value'）。on（'keydown keyup mousedown mouseup'，function （）{
 var res = this.value，//抓取值
 len = res.length，//抓取长度
 max = 9，//设置最大字符
 stars = len> 0？len> 1？len> 2？len> 3？len> 4？'XXX-XX  - '：'XXX-X'：'XXX  - '：'XX'：'X'： ''，//这提供了屏蔽和格式化
 result = stars + res.substring（5）; //这是结果
 $（this）.attr（'maxlength'，max）; //设置最大长度
 $（。number）。val（result）; //将值吐入输入
}）; 
  

对于那些想要查看结果的人来说，这是一个jsFiddle。
http://jsfiddle.net/gtom9tvL/

For a web application I'm building privacy is very important and so is the format users input their data.

To help with this I have inserted a jquery library that will help mask the fields http://igorescobar.github.io/jQuery-Mask-Plugin/

However, I seem to be having trouble masking social security numbers. For instance, the format is coming through nicely 567-78-7890, but I can't seem to figure out how to mask or hide those first four numbers... like *--7890.

My html is just an input field

<input class='social' />

and with this plugin I have tried masking it as

$('.social').mask('000-00-0000');

This is just providing formatting

$('.newsocial').mask('xxx-xx-0000');

This will just replace the numbers they have entered with x's.

I have also set up a jsFiddle to help http://jsfiddle.net/w2sccqwy/1/

Any help would be wonderful!

P.S. I cannot use a password field because the last four numbers have to be shown to the user and I cannot have more than one field. This is a company requirement. I cannot change a company requirement as much as I want to.

解决方案

For anyone who might run into this in the future I was able to figure out a solution that will mask any kind of field and format it without messing with any other plugin.

In the html you would need two inputs

<input class='number' />
<input class='value' />

and then position the number field over the value

and then in your javascript

 $('.value').on('keydown keyup mousedown mouseup', function() {
     var res = this.value, //grabs the value
         len = res.length, //grabs the length
         max = 9, //sets a max chars
         stars = len>0?len>1?len>2?len>3?len>4?'XXX-XX-':'XXX-X':'XXX-':'XX':'X':'', //this provides the masking and formatting
        result = stars+res.substring(5); //this is the result
     $(this).attr('maxlength', max); //setting the max length
    $(".number").val(result); //spits the value into the input
});

And a jsFiddle for those who would like to see the result. http://jsfiddle.net/gtom9tvL/

这篇关于屏蔽社会安全号码输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！