ASP.Net中的電話掩碼

Question

我正在做一個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>

Answer 1

您必須記住，默認情況下，您在服務器上的元素上指定的ID不是客戶端上使用的ID。 而且由於JavaScript在客戶端上運行，所以由於ID不匹配，所以沒有得到正確的元素。 您有很多選擇。 當新的Web Forms開發人員開始使用母版頁，模板化控件或用戶控件（.ascx）時，這通常會使他們苦惱。

---

更改客戶ID模式方法

您可以更改元素的ClientIdMode（也可以在頁面或web.config級別上完成）。

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

---

嵌入客戶ID方法

只要您的JavaScript直接在Web窗體頁面或控件中，就可以將Client ID嵌入到JavaScript中。

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

---

使用課堂方法

或者在某些情況下（這是一個很好的候選人），一堂課更有意義。

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

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