3

我有一个简单的.aspx页面和一个文本框，我想使用它来屏蔽它jquery.maskedinput-1.3.js，我的页面 .aspx 代码如下，问题是在第一页加载时我的文本框被屏蔽了，但是在 asyncPostback 之后，屏蔽的输入插件不起作用！如何使蒙面输入插件工作？提前谢谢。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery.js" type="text/javascript"></script>
    <script src="Scripts/jquery.maskedinput-1.3.js" type="text/javascript"></script>
    <script type='text/javascript'>
        jQuery(function ($) {
            $("#txtMembershipCode").mask("999-9999-999-9999");
        });

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager> 
    <div style="float: right" id="exDiv">
                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                        <div style="float: right; width: 120px; font-family: Tahoma">
                            membership Code :</div>
                        <div style="float: left">
                            <asp:TextBox ID="txtMembershipCode" runat="server" CssClass="input" ClientIDMode="Static"
                                dir="ltr"></asp:TextBox>
                        </div>
                        <div style="font-family: Tahoma; float: left">
                            <asp:Button ID="btn" runat="server" Text="save" OnClick="btn_Click" CssClass="mybtn" /></div>
                        <div style="font-family: Tahoma; float: right">
                            <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
                                <ProgressTemplate>
                                    <img src="Images/484.gif" />
                                </ProgressTemplate>
                            </asp:UpdateProgress>
                        </div>
                    </ContentTemplate>
                </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

我在网上尝试了许多不同的方法，但都没有奏效！

4

2 回答 2

4

这是解决此问题的一种方法-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery.js" type="text/javascript"></script>
    <script src="Scripts/jquery.maskedinput-1.3.js" type="text/javascript"></script>
    <script type='text/javascript'>
        window.onload = function () {
            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);
        }

        function endRequestHandler(sender, args) {
            init();
        }

        function init() {
            $("#<%=txtMembershipCode.ClientID %>").mask("999-9999-999-9999");
        }

        $(function() { // DOM ready
            init();
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager> 
    <div style="float: right" id="exDiv">
                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                        <div style="float: right; width: 120px; font-family: Tahoma">
                            membership Code :</div>
                        <div style="float: left">
                            <asp:TextBox ID="txtMembershipCode" runat="server" CssClass="input" dir="ltr"></asp:TextBox>
                        </div>
                        <div style="font-family: Tahoma; float: left">
                            <asp:Button ID="btn" runat="server" Text="save" OnClick="btn_Click" CssClass="mybtn" /></div>
                        <div style="font-family: Tahoma; float: right">
                            <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
                                <ProgressTemplate>
                                    <img src="Images/484.gif" />
                                </ProgressTemplate>
                            </asp:UpdateProgress>
                        </div>
                    </ContentTemplate>
                </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

这种方法使用Sys.WebForms.PageRequestManager JavaScript 类并且是可能的，因为您的页面上有一个脚本管理器.aspx。基本上在每次异步回发之后，init()都会调用该函数。

请注意，该init()函数也在 DOM 就绪中调用。这允许您在异步回发期间内容更改后再次对 DOM 执行所有操作。在使用包括这个在内的各种 jQuery 插件之前，我已经使用过这种技术。

于 2013-09-21T19:34:40.937 回答
0

我使用了功能 pageLoad

<script type='text/javascript'>

        function pageLoad() {
            $("#<%=txtMembershipCode.ClientID %>").mask("999-9999-999-9999");
        }

</script>
于 2020-05-06T09:52:29.027 回答