在母版中使用Jquery遇到问题

假设我想在母版页中控制两个Div的显隐，代码如下：
<script type="text/javascript"> 
$(function()
 {
    $("#changeform1").click(function()
       {
         $("#tips").text("注册新账号...");
         $("#subform2").show();
         $("#subform1").hide();   
       });
       
    $("#changeform2").click(function()
      {
       $("#tips").text("登录到网站...");
       $("#subform1").show();   
       $("#subform2").hide();
       });
 });
</script>  
这两个div是放在Master页里面的，如果把上面这段JS代码同样加在Master页里面，执行就会失败。但如果把这段代码写在子页面的Content里面，哪怕这个子页的Content里只有这段JS，却可以正常控制Master页里面的这两个Div显隐……我也试过同时在Master页和子页里面都写这段代码，然后翻看IE的源代码，是一模一样的，但仍然是写在子页里的才能生效。难道在母版页面里面使用Jquery会失效？
我认为不涉及ID的问题，因为既然能在子页面里面成功让母版页面里面的DIV执行，就证明能找得到ID。而且这个不是Server控件，ID不会被更改的。同理应该也不是调用的Jquery库的路径问题吧？

解决方案 »

  1.   

    不要在设计页面上乱丢jaavscript代码。注册脚本代码，使用 RegisterStartupScript。
      

  2.   

    当然你也可以使用  RegisterClientScriptInclude，或者你也可以（把它放到资源文件中然后）使用RegisterClientScriptResource。总之这些是跟你的aspx、ascx、master page之类的设计代码相分离的，其操作更加简单一致，有了任何问题你也好根据其机制去更加直接地找出问题。
      

  3.   

    看你是放在母版页的顶部还是尾部了，总之要放在changeform1\tips\subform2...这后，因为要先有以上对象，才能执行，所以一般我们都会放到body onload="xxx()",要不就直接放到版尾
      

  4.   


        <script type="text/javascript">
            $(document).ready(function () {
                $('#changeform1').bind('click', function () {
                    $("#tips").text("注册新账号...");
                    $("#subform2").show();
                    $("#subform1").hide();
                });
                $('#changeform2').bind('click', function () {
                    $("#tips").text("登录到网站...");
                    $("#subform1").show();
                    $("#subform2").hide();
                });
            });
        </script>
    修改完毕，放到哪里都行，前提是你的div不是runat=server的
      

  5.   

    感谢，但还是不行哦。我贴个简易代码上来看看
    <%@ Master Language="C#" AutoEventWireup="true" CodeFile="~/cs/aa.master.cs" Inherits="aa" %>
    <!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" id="sc" runat="server">
    <head id="Head1" runat="server">
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <link rel="shortcut icon" href="<%= Page.ResolveClientUrl("~/weblogo.ico") %>" />
    <script type="text/javascript" src="<%= Page.ResolveClientUrl("~/js/jquery-1.3.min.js") %>"></script>
    <script type="text/javascript" src="<%= Page.ResolveClientUrl("~/js/jquery.scrollTop.js") %>"></script>
    <link rel="stylesheet" type="text/css" href="<%= Page.ResolveClientUrl("~/css-b/nav-1.css") %>" />
    <link rel="stylesheet" type="text/css" href="<%= Page.ResolveClientUrl("~/css-b/index.css") %>" />
    <link rel="stylesheet" type="text/css" href="<%= Page.ResolveClientUrl("~/css-b/login.css") %>" />
    </head><body>
    <form id="Form1" runat="server" method="post">
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <div class="body0">
       <div class="topcan1">
          <div class="topcan2">
             <div class="topcan2a">
                  <a href="#" class="lnava">导航1</a>
                  <a href="#" class="lnava">导航2</a>
                  <a href="#" class="lnava">导航3</a>
             </div>
          </div>
       </div>
    </div>
    <div class="body1">
     <div class="body">
     <asp:UpdatePanel ID="topfixup" runat="server">
     <ContentTemplate>
       <div class="bodybgs1">
                <div class="logini" id="loginbox" runat="server">
         <div style=" font:bold 15px '微软雅黑', Arial, Helvetica, sans-serif;color:#59595a;width:180px; float:left; padding-bottom:13px;" id="tips">登录到网站...</div>
         <div id="subform1" style="width:180px; float:left;">
             <div class="tbdiv"><asp:TextBox runat="server" ID="txemail1" CssClass="txemail1"></asp:TextBox></div> 
             <div class="tbdiv"><asp:TextBox runat="server" TextMode="Password" ID="txpw1" CssClass="txpw1"></asp:TextBox></div> 
             <div class="tbdiv" style="padding:7px 0 10px 0;"><asp:CheckBox ID="CheckBox1" runat="server" Text="记住我的登录信息" Checked="true" /></div> 
             <div style="width:175px; float:left;font:12px/18px  '微软雅黑',Arial, Helvetica, sans-serif; height:18px; color:#bbb; padding:5px 0 0 5px;"><a class="linkbtn">登录</a>　<a class="linkbtn">忘记密码</a>　|　<a class="linkbtn" id="changeform1" >快速注册</a></div>
         </div>
         <div id="subform2" style="width:180px; float:left; display:none;">
             <div class="tbdiv"><asp:TextBox runat="server" ID="TextBox1" CssClass="txemail2"></asp:TextBox></div> 
             <div class="tbdiv"><asp:TextBox runat="server" TextMode="Password" ID="TextBox2" CssClass="txpw2"></asp:TextBox></div> 
             <div class="tbdiv"><asp:TextBox runat="server" ID="TextBox3" CssClass="txname"></asp:TextBox></div> 
             <div style="width:175px; float:left;font:12px/18px  '微软雅黑',Arial, Helvetica, sans-serif; height:18px; color:#bbb; padding:3px 0 0 5px;"><a class="linkbtn">提交注册</a>　|　<a class="linkbtn" id="changeform2">我已有账号</a></div>
         </div>
             </div>
         </div>
         </ContentTemplate>
         </asp:UpdatePanel>
       <div class="bodybgs2">
            <asp:ContentPlaceHolder id="rightc1" runat="server"></asp:ContentPlaceHolder>
        </div>
        </div>
    </div>
    </form>
    </body>
    </html><script type="text/javascript"> $(function()
     {
        $("#changeform1").click(function()
           {
             $("div#subform2").show();
             $("div#subform1").hide();   
             $("div#tips").text("注册新账号...");
           });
           
        $("#changeform2").click(function()
          {
           $("div#subform1").show();   
           $("div#subform2").hide();
           $("div#tips").text("登录到网站...");
           });
     });</script>  
      

  6.   

    我也遇到类似问题了，mvc的母板页中，搞死都运行不了jquey代码，连alert（“Hello！”），都不行，晕死
      

  7.   

    我也遇到类似问题了，mvc的母板页中，搞死都运行不了jquey代码，连alert（“Hello！”），都不行，晕死
      

  8.   

    我也遇到类似问题了，mvc的母板页中，搞死都运行不了jquey代码，连alert（“Hello！”），都不行，晕死