ASP.Net中的电话掩码 [英] Phone Mask in ASP.Net

问题描述

我正在做一个ASP.Net应用程序，我需要在TextBox中使用电话掩码输入.我正在使用jQuery，但无法正常工作.

i am doing a ASP.Net application and I need to use phone mask input in a TextBox. I am using jQuery and it is not working.

Asp.net:

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

javascript:

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>

推荐答案

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

You have to keep in mind that the ID you specify on elements on the server, by default, is not the ID that is used on the client. And since JavaScript runs on the client, then it's not getting the right element because of the ID mismatch. You have a number of options. This often trips up new Web Forms developers when they start using Master Pages, templated controls, or user controls (.ascx).

您可以更改元素的ClientIdMode(这也可以在页面或web.config级别上完成).

You can change ClientIdMode for the element (this can also be done at the page or web.config levels).

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

---

嵌入式客户端ID方法

只要您的JavaScript直接在Web窗体页面或控件中，就可以将客户端ID嵌入到JavaScript中.

---

Embed Client ID approach

You can embed the Client ID in the JavaScript, as long as your JavaScript is directly in a Web Forms page or control.

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

---

使用类方法

或者在某些情况下(这是一个很好的候选人)，一堂课更有意义.

---

Use a class approach

Or in some situations (this is a good candidate), a class makes more sense.

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

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

这篇关于ASP.Net中的电话掩码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！