jQuery插件不起作用

Question

我有一个 JQuery 日期掩码，但是当我运行该页面时，它会抛出一个错误“Microsoft JScript 运行时错误：对象不支持此属性或方法”。

现在，这个特定的 JQuery 打算工作的控件被动态添加到转发器控件中。通过这个，我查看了控件的 ID，它在 Visual Studio 中中断和停止的位置以及 aspx 页面上显示的内容。除了 JQuery 开头的“#”之外，ID 是相同的，它不在页面上。

在我的 JQuery 代码中：

JQuery(function ($) {

$('#<%=date.ClientID %>').mask("99/99/9999");

});

有没有告诉 JQuery 在查找控件时不要包含“#”？我使用了 UniqueID，但这会将任何下划线更改为“$”，这与页面上的内容不同。我唯一的问题是 ID 开头的“#”号。我什至添加了一个警告框来检查文本框是否存在并且它返回为空。我什至尝试向文本框添加 CssClass 属性，但这也发生了同样的错误。

请注意，具有文本框的自定义用户控件是以编程方式添加到转发器的。

代码如下：

带有中继器的用户控制

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Step4.ascx.cs"
    Inherits="Prototype.Step4" %>
<div style="height: 800px; margin-top: 20px; overflow-x: hidden; overflow-y: scroll">
    <p>
        <b>Edit Stage</b></p>

    <asp:Repeater ID="Edit" runat="server">
        <HeaderTemplate>
            <table>
        </HeaderTemplate>
        <FooterTemplate>
            </table>
        </FooterTemplate>
        <ItemTemplate>
            <tr>
                <td>
                    <asp:Label ID="RowLabel" runat="server" Text="Label" ></asp:Label>
                </td>
                <td>
                    <asp:PlaceHolder ID="ControlPlaceHolder" runat="server"></asp:PlaceHolder>
                </td>
            </tr>
        </ItemTemplate>
    </asp:Repeater>
</div>

动态添加到上面控件的遮罩控件

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MaskControl.ascx.cs" Inherits="Prototype.CommonControls.MaskControl" %>


<asp:TextBox ID="date" runat="server" Width="136px" CssClass="dateMask"></asp:TextBox>


<script src="../../Scripts/jquery-1.4.2.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.maskedinput.js" type="text/javascript"></script>

<script type="text/javascript">
//    jQuery(function ($) {
//        $('.dateMask').mask("99/99/9999");
//    });
    alert(document.getElementById("MaskedDateBox"));
</script>

谁能帮忙？

Answer 1

您是否尝试过使用：

$(document).ready(function() { $(.dateMask).mask("99/99/9999"); });

动态添加用户控件不会更改添加控件的 css 类，它会根据其命名容器更改 id。

Answer 2

jQuery(function() {
    jQuery('.dateMask').mask("99/99/9999");
});

应该可以。

我不太清楚你的意思是什么：

告诉 JQuery 不要包含“#” 找到控件时

当您在选择器中使用 # 时，表示通过 id 查找控件。

使用类选择器而不是 id 选择器获取 asp.net 控件更简洁，恕我直言。

所以稍微扩展一下解释。如果您不使用 ajax，那么您如何生成控件并不重要 - 当 $(document).ready() 事件触发时，您的所有文本框都会出现在页面上，并设置它们的类。在这种情况下，您只需运行一次以下代码（即把js放在页面上而不是放在控件中）

jQuery(function() {
    jQuery('.dateMask').mask("99/99/9999");
    jQuery('.phoneMask').mask("(999) 999-9999");  // if you have one
    ...
});

如果您使用 ajax 加载控件，则每次 ajax 请求完成时都必须运行上面的 javascript 代码。您可以通过在 Page_Load 中使用 ScriptManager 注册一个脚本来做到这一点，如下所示：

public void Page_Load(object sender, EventArgs e) {
    ScriptManager.RegisterStartupScript(updatePanel, updatePanel.GetType(), "mask", "initMask();", true);
}

您必须在您的页面上定义 initMask() javascript 函数。

function initMask() {
    jQuery('.dateMask').mask("99/99/9999");
    jQuery('.phoneMask').mask("(999) 999-9999");  // if you have one
    ...
}