如何为输入的每个掩码值显示未屏蔽的值? [英] How to display unmasked value for each mask value entered?

查看:110
本文介绍了如何为输入的每个掩码值显示未屏蔽的值?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

您好。我有一个我在VS 2010 ASP.NET中创建的Web表单。我有一个用于Web表单的jQuery插件。我完成了掩蔽。当用户在文本框中输入数字值并单击或标签到下一个文本框时,输入的值将显示为未屏蔽的值。当用户在第二个文本框中输入新值时,当前未屏蔽的值将消失。我想为每个文本框显示两个值。我怎样才能做到这一点?另外,我将文本框值屏蔽为999,999,999,999。如果用户只有123,456。如何让文本框保留该值而不是丢失它?



这是我的代码:



Hello. I have a web form that I made in VS 2010 ASP.NET. I have a jQuery plugin for the web form. I have the masking done. When a user enters a number value in the textbox and clicks or tabs to the next textbox the value entered is displayed as an unmasked value. When the user enters a new value in the second textbox the current unmasked value disappears. I would like to display both values for each textbox. How can I do this? Also, I masked the textbox value to be 999,999,999,999. If a user only has 123,456. How can I get the textbox to keep that value instead of loosing it?

Here is my code:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>jQuery Masked Input Demo</title>
    <script src="Jquery Scripts/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script src="Jquery Scripts/jquery.maskedinput.js" type="text/javascript"></script>
    <script type='text/javascript'>
        $(function () {
            $.mask.definitions['~'] = "[+-]";
            $("#TextBoxY").mask("999,999,999,999");
            $("#TextBox1").mask("999,999,999,999");

            $("input").blur(function() {
            $("#lblinfo").html(" " + $(this).mask());
        }).dblclick(function() {
            $(this).unmask();



        });
    });

    </script>

    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            width: 245px;
        }
        .style3
        {
            width: 66px;
        }
        .style4
        {
            width: 245px;
            text-align: left;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    </div>
    <table class="style1">
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBoxINST_ID" runat="server"></asp:TextBox>
            </td>
            <td>
                <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Submit" 

                    Width="100px" /> 
            </td>
        </tr>
        <tr>
            <td class="style3">
                Hourly</td>
            <td class="style4">
                <asp:TextBox ID="TextBox1"  runat="server" Width="180px" 

                    AutoCompleteType="Email" ClientIDMode="Static" 

            style="text-align: left"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                Yearly</td>
            <td class="style4">
    <asp:TextBox ID="TextBoxY" runat="server" Width="180px" 

                    AutoCompleteType="Email" ClientIDMode="Static" 

            style="text-align: left"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            </td>
            <td>
                <asp:Label ID="lblinfo" runat="server"></asp:Label>
            </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBox3" runat="server" ontextchanged="TextBox3_TextChanged" 

                    AutoPostBack="True"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBox5" runat="server"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBox6" runat="server"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
    </table>
    </form>
</body>
</html>

推荐答案

(function () {


.mask.definitions['~'] = \"[+-]\";
.mask.definitions['~'] = "[+-]";


(\"#TextBoxY\").mask(\"999,999,999,999\");


这篇关于如何为输入的每个掩码值显示未屏蔽的值?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆