ASP.Net 中的电话掩码答案

【问题标题】：Phone Mask in ASP.NetASP.Net 中的电话掩码
【发布时间】：2015-11-12 19:18:15
【问题描述】：

我正在做一个 ASP.Net 应用程序，我需要在 TextBox 中使用电话掩码输入。我正在使用 jQuery，但它不起作用。

Asp.net：

<asp:TextBox runat="server" ID="txtCelular" CssClass="w240 placeholder"></asp:TextBox>

javascript：

    <script src="\scripts\jquery-1.7.2.js" type="text/javascript"></script>
<script type="text/javascript">
    $("#txtCelular").mask("(999) 9999-9999?9");


    $("#txtCelular").on("blur", function () {
        var last = $(this).val().substr($(this).val().indexOf("-") + 1);

        if (last.length == 5) {
            var move = $(this).val().substr($(this).val().indexOf("-") + 1, 1);

            var lastfour = last.substr(1, 4);

            var first = $(this).val().substr(0, 9);

            $(this).val(first + move + '-' + lastfour);
        }
    });
</script>

【问题讨论】：

标签： jquery asp.net validation mask phone-number

【解决方案1】：

您必须记住，默认情况下，您在服务器上的元素上指定的 ID 不是客户端上使用的 ID。由于 JavaScript 在客户端上运行，因此由于 ID 不匹配，它无法获取正确的元素。你有很多选择。当新的 Web 表单开发人员开始使用母版页、模板化控件或用户控件 (.ascx) 时，这通常会绊倒他们。

更改客户端 ID 模式方法

您可以更改元素的 ClientIdMode（这也可以在页面或 web.config 级别完成）。

<asp:TextBox runat="server" ID="txtCelular" ClientIdMode="static" CssClass="w240 placeholder" />

嵌入客户端 ID 方法

您可以在 JavaScript 中嵌入客户端 ID，只要您的 JavaScript 直接位于 Web 窗体页面或控件中。

$("#<%= txtCelular.ClientId %>").mask("(999) 9999-9999?9");

使用类方法

或者在某些情况下（这是一个很好的候选），一个类更有意义。

<asp:TextBox runat="server" ID="txtCelular" CssClass="w240 placeholder phonemask" />

$(".phonemask").mask("(999) 9999-9999?9");

【讨论】：