Jquery脚本无法在母版页中工作

时间:2011-12-16 13:22:40

标签: jquery asp.net

此代码在.aspx页面中正常工作没有问题。但如果我使用母版页,那么这里没什么用,

我尝试将JQuery脚本放在母版页中,即使这样也没有任何效果。是否有任何设置需要在这里完成。

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Untitled Page</title>
    <script src="jquery-1.6.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function() 
    {
     $('#<%= CheckBox1.ClientID %>').change(function() 
    {    
     if($(this).is(':checked')) 
     {       
      $("#divControlGroup").css("display", "block");   
      $("#ddlcounty option:first").attr("selected", true); 
      } 
     else 
        { 
    $("#divControlGroup").css("display", "none"); 
     } 
        })
        });
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <table>
        <tr>
            <td>
                <asp:CheckBox ID="CheckBox1" runat="server" Checked="false" />
            </td>
            <td>
                <div id="divControlGroup" runat="server">
                    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
                    <asp:DropDownList ID="ddlcounty" runat="server">
                      <asp:ListItem Value="0">Select</asp:ListItem>
                        <asp:ListItem Value="1">India</asp:ListItem>
                        <asp:ListItem Value="2">US</asp:ListItem>
                        <asp:ListItem Value="3">UK</asp:ListItem>
                    </asp:DropDownList>
                </div>
            </td>
        </tr>
    </table>
    </form>
</body>
</html>

任何帮助都会被贬低

由于

2 个答案:

答案 0 :(得分:4)

更改您的MasterPage脚本引用以使用ResolveUrl()并将您的脚本放在正在使用的ContentPlaceHolder中:

 <script src='<%= Page.ResolveUrl("~/jquery-1.6.2.min.js")' type="text/javascript"></script>

 //script related to the specific page needing ClientID refs
 <asp:Content ID="Content2" ContentPlaceHolderID="Content" Runat="Server" >
    <script>....</script>
</asp:content>

答案 1 :(得分:4)

如果您正在使用母版页(和内容占位符),请执行以下操作: $("#divControlGroup")无效。您需要在代码中使用clientID,就像之前一样。

内容占位符会被添加到ID中,这就是它不匹配的原因。