android2.3.3上带有jquery的ssn掩码答案

【问题标题】：ssn mask with jquery on android2.3.3android2.3.3上带有jquery的ssn掩码
【发布时间】：2012-03-01 22:28:22
【问题描述】：

我正在尝试提供一个掩码，使用户能够以 999-99-9999 的格式输入 ssn。我尝试使用屏蔽输入插件from digital bush。这适用于 chrome 和 safari，但不适用于 android。

问题：输入数字时，直到 123- 都可以，当我输入接下来的 2 位数字时，它会颠倒顺序。例如：如果我输入 123-45，它将显示为 123-54，并且每个分隔符都会出现此问题。例如：如果我输入 123-45-6789，它会显示为 123-56-8974

我尝试如下编写自己的代码来处理按键和按键操作，但仍然遇到同样的问题。有没有人成功屏蔽了android上的输入？什么是替代方案？

这里是完整的 html，带有本地代码链接：

<!DOCTYPE html> 
<html> 
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title> test ground</title> 

    <!-- JQuery specific -->
    <script type="text/javascript" src="libs/jQuery/jQuery.min.js"  ></script>
    <script type="text/javascript" src="libs/jQuery/mobile/jquery.mobile.min.js"></script>
    <link rel="stylesheet" href="libs/jQuery/mobile/jquery.mobile.min.css" />
    <script src="javascript/jquery.maskedinput-1.3.js" type="text/javascript" charset="utf-8"></script>

    <!-- Application specific -->
    <script type="text/javascript">
    $(document).bind('mobileinit',function(){
    //  $.mobile.page.prototype.options.addBackBtn = true;
    //  $.mobile.page.prototype.options.backBtnText = "Previous";
    //  $.mobile.page.prototype.options.backBtnTheme = "b";
    });

    $("[data-role='page']").live("pageshow", function(event) {          
        $("#primaryssn").mask("999-99-9999");
    });

    </script>  

</head> 

<body> 

<!-- ################### PAGE: launchpage ################### -->
<div data-role="page" id="launchpage">
    <div id="header" data-role="header" data-position="fixed" >     
        <div id="headerlogo" > </div>
        <h1 class="appTitle" >My App</h1>
    </div> 

    <div data-role="content" >  
        <div class="content-primary">
            <p> Welcome to my app </p> <br/>
        </div>

        <!-- Primary SSN -->
        <div data-role="none">
            <label name="lblprimaryssn" for="primaryssn" > SSN</label>
            <input type="text" name="primaryssn" id="primaryssn" value="" />
            <span class="error" id="primaryssnerror"> Please enter your SSN as (999-99-9999) </span>
        </div>
        <br/>

    </div><!-- /content --> 
</div><!-- /launch page -->

</body>
</html>

这是我用于根据 keyup 上的击键屏蔽输入的代码：

// _v is value passed in on keyup in this input field
// _d indicates if the key is a backspace to delete character
var setSSN = function (_v, _d){
    var v = $.trim(_v);

    if ( !_d ){
        if ( v.length <= 3 ) {
            var validformat1=/^\d{1,3}$/ ;
            if ( validformat1.test(v)) {
                if ( v.length == 3 ) v = v + '-';
                return v;
            }
        }
        else if ( v.length >3 && v.length <= 6) {
            var validformat2=/^\d{3}\-\d{0,2}$/ ;
            if ( validformat2.test(v)) {
                if ( v.length == 6 ) v = v + '-';
                return v;
            }
        }
        else {
            var validformat3=/^\d{3}\-\d{2}\-\d{0,4}$/ ;
            if ( validformat3.test(v)) {
                if ( v.length == 6 ) v = v + '-';
                return v;
            }
        }

        v = v.substring(0,v.length-1);          
        return v;
    }
    else {
        if ( 3 == v.length || 6 == v.length ) {
            v = v.substring(0,v.length-1);
        }
    }
    return v;
}

【问题讨论】：

我也遇到了同样的问题。还没找到解决办法。

标签： android cordova jquery-mobile

【解决方案1】：

如果您只想在输入时隐藏字符，您可以使用

<input type="password">

【讨论】：

【解决方案2】：

此问题已在屏蔽输入 jquery 插件中得到修复。更新到最新版本应该可以解决此问题。

【讨论】：