当前位置:编程学习 > C#/ASP.NET >>

一个很奇怪的菜单刷新的问题

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="qikan.aspx.cs" Inherits="qikan %> 
 
<!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 id="Head1" runat="server"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta http-equiv="x-ua-compatible" content="ie=7" /> 
    <title>电子期刊</title> 
    <style type="text/css"> 
        a{TEXT-DECORATION:none; color:White} 
        a:hover{TEXT-DECORATION:underline; color:White} 
        .style2 
        { 
            width: 970px; 
            text-align: center; 
        } 
        .style4 
        { 
            text-align: center; 
        } 
        .style5 
        { 
             width: 190px; 
        } 
        .style6 
        { 
             width: 700px; 
        } 
        td{   cursor:   hand;   font-family:   Tahoma;   color:Black;   font-size:   11pt   }    
        .classMenu{ color:White; background-color: #5D7CB5; border-bottom:solid 1px white}    
 
        .style7 
        { 
            color: White; 
            background-color: #5D7CB5; 
            border-bottom: solid 1px white; 
            width: 180px; 
        } 
 
        .style8 
        { 
            width: 180px; 
            height: 20px; 
        } 
 
        .style9 
        { 
            width: 970px; 
            text-align: center; 
            height: 166px; 
        } 
        </style>   
</head> 
 
 
<body bgcolor="#cdc7c7"> 
      <script type="text/javascript" language="javascript">    
       
          function TestBlack(TagName){ 
          var obj = document.getElementById(TagName); 
          if(obj.style.display==""){ 
          obj.style.display = "none"; 
          }else{ 
          obj.style.display = ""; 
          } 
          } 
 
          function   High()    
          {    
          if(event.srcElement.className=="classItem")    
          {    
           
          event.srcElement.style.background="336699"    
          event.srcElement.style.color="white"    
          }    
          }    
 
          function   Low()    
          {    
          if(event.srcElement.className=="classItem")    
          {    
          event.srcElement.style.background="#7593C7"    
          event.srcElement.style.color="white"    
          }    
          } 
              
         function InitFrameHeight(){    
         var iframe = document.getElementById("mainFrame");    
         try{    
         var bHeight = iframe.contentWindow.document.body.scrollHeight;    
         var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;    
         var height = Math.max(bHeight, dHeight);    
         iframe.height =  height;    
         }catch (ex){}    
         } 
         window.setInterval("InitFrameHeight()", 100); 
          </script>           
               
    <form id="form1" runat="server"> 
    <center> 
        <div style="background-image: url('App_Themes/工作组副页(上).jpg'); background-repeat:no-repeat; background-position:center" 
            class="style9"> 
            <div style="text-align:left; padding-left: 46px; margin-top: 0px;  height:97px "> 
       </div> 
       <div style="text-align:left; padding-left: 46px; margin-top: 0px; height: 30px;"> 
                <table border="0" cellspacing="0" cellpadding="2"> 
                 <tr> 
          <td height="25" align="center" width="1"></td> 
          <td style=" width:140px" class="style4"> 
                        <asp:LinkButton ID="LinkButton1" runat="server" Font-Names="微软雅黑"  
                  ForeColor="Silver" onclick="LinkButton1_Click"  Font-Size="Medium">首页</asp:LinkButton> 
            </td> 
              <td style="color:Silver">|</td> 
          <td style=" width:140px" class="style4"> 
              <asp:LinkButton ID="LinkButton2" runat="server" Font-Names="微软雅黑"  
                  ForeColor="Silver" onclick="LinkButton2_Click" Font-Size="Medium">工作组介绍</asp:LinkButton> 
                     </td> 
                       <td style="color:Silver">|</td> 
          <td style=" width:140px" class="style4"> 
              <asp:LinkButton ID="LinkButton3" runat="server" Font-Names="微软雅黑"  
                  ForeColor="Silver" onclick="LinkButton3_Click" Font-Size="Medium">成果展示</asp:LinkButton> 
                     </td> 
                       <td style="color:Silver">|</td> 
          <td style=" width:140px" class="style4"> 
              <asp:LinkButton ID="LinkButton4" runat="server" Font-Names="微软雅黑"  
                  ForeColor="Silver" onclick="LinkButton4_Click" Font-Size="Medium">电子期刊</asp:LinkButton> 
                     </td> 
                       <td style="color:Silver">|</td> 
          <td style=" width:140px" class="style4"> 
              <asp:LinkButton ID="LinkButton5" runat="server" Font-Names="微软雅黑"  
                  ForeColor="Silver" onclick="LinkButton5_Click" Font-Size="Medium">留言</asp:LinkButton> 
                     </td> 
          <td ></td> 
          <td width="230" colspan="0" rowspan="1" > 
              <asp:TextBox ID="TextBox1" runat="server" BorderStyle="None" Height="16px"  
                  Width="154px" BorderWidth="0px"></asp:TextBox> 
              <asp:ImageButton ID="ImageButton1" runat="server" Height="13px" Width="13px" 
                  ImageUrl="~/App_Themes/SkinFile/ss.png" onclick="ImageButton1_Click" /> 
          </td> 
        </tr> 
                </table> 
       </div> 
      </div> 
       
      <div style="background-image: url('App_Themes/工作组副页(中).jpg');background-position:center; width:970px " onload="Javascript:SetWinHeight(this)"> 
            <div style="text-align:center; padding-left: 40px;*padding-left: 0px"> 
            <table  border="0" cellspacing="0" cellpadding="2"> 
          <tr> 
          <td class="style5" style="vertical-align:top">            
              <table   border="0"   width="180" style=" text-align:center"  
                  cellspacing="0"   cellpadding="0">   
                  <tr>  
                      <td class="style4">  
                      <div style="background-image: url('App_Themes/导航上.jpg'); width: 180px; height:20px; border-bottom:solid 1px white"></div> 
                      <div class="style7" ><a href='文章/期刊资料/投稿指南.htm' target="mainFrame">投稿指南</a></div> 
                       <div class="style7" ><a href='文章/期刊资料/编委.htm' target="mainFrame">编委</a></div>     
                       <div class="style7" ><a href='文章/期刊资料/编辑人员.html' target="mainFrame">编辑人员</a></div>   
                      
 

--------------------编程问答--------------------
  <div class="style7"   onclick="TestBlack("Div1");changename()">2008年期刊内容</div>    
           <div   onmouseover="High()"   onmouseout="Low()"   id="Div1" style="display:none"  >    
          <asp:LinkButton  ID="LinkButton7" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor="#7593C7" onclick="LinkButton7_Click">2008年第一卷第1期</asp:LinkButton>   
         <asp:LinkButton  ID="LinkButton8" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor=" #7593C7" onclick="LinkButton8_Click" style="height: 18px" >2008年第一卷第2期</asp:LinkButton> 
                      </div> 
                       
          <div class="style7"   onclick=TestBlack("Div2")>2009年期刊内容</div>    
              <div   onmouseover="High()"   onmouseout="Low()"   id="Div2"   style="display:none"  >    
          <asp:LinkButton  ID="l2" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor="#7593C7" onclick="l2_Click">2009年第一卷第1期</asp:LinkButton>   
         <asp:LinkButton  ID="LinkButton6" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor=" #7593C7"  >2009年第一卷第2期</asp:LinkButton> 
          <asp:LinkButton  ID="LinkButton9" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor=" #7593C7" onclick="LinkButton9_Click" >2009年第一卷第3期</asp:LinkButton>  
    <asp:LinkButton  ID="LinkButton10" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor=" #7593C7" onclick="LinkButton10_Click" >2009年第一卷第4期</asp:LinkButton>    
                              </div> 
                               
       <div class="style7"   onclick=TestBlack("Div3")>2010年期刊内容</div>    
     <div   onmouseover="High()"   onmouseout="Low()"   id="Div3"   style="display:none"  >    
          <asp:LinkButton  ID="LinkButton11" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor="#7593C7" >2010年第一卷第1期</asp:LinkButton>   
          <asp:LinkButton  ID="LinkButton12" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor="#7593C7" onclick="LinkButton12_Click">2010年第一卷第2期</asp:LinkButton>   
          <asp:LinkButton  ID="LinkButton13" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor="#7593C7" onclick="LinkButton13_Click">2010年第一卷第3期</asp:LinkButton>   
        </div> 
         
          <div style="background-image: url('App_Themes/导航下.jpg'); " class="style8"></div> 
                   </td> 
                   </table> 
                   <td class="style6" style="vertical-align:top" align="right"> 
           <iframe  id="mainFrame" name="mainFrame" marginwidth="0" marginheight="0" src="<%=Request.QueryString["htm"].ToString()%>" style=" border: 0px solid #e7f5f6; width:685px; font-family: 宋体, Arial, Helvetica, sans-serif; font-size: 12px; background-color:#c3dcce" frameborder="0" scrolling="no" onload="InitFrameHeight()"></iframe>   
          </td> 
           
           </tr>    
             </table>       
              </div>     
           
     <div style="background-image: url('App_Themes/工作组副页(下).jpg');height:124px; background-position:center; background-repeat:no-repeat " 
            class="style2"> 
            <div style="text-align:center; padding-left:0px; margin-top:0px;  height:65px"> 
         
         </div> 
                </div> 
       </div> 
       </center> 
    </form> 
</body> 
</html> 

   最近在改一个网站,要求改动不能太大。遇到一个大问题。就是菜单的展开问题。以上这段代码的菜单不是用css+<a>标签的方式写的。而是用DIV+Linkbutton的方式写的。点击Linkbutton从后台传值到前台,用到的是Redirect,所以整个页面会刷新,iframe里根据Url读取参数然后显示出数据。这样菜单就不能保持展开的状态了。
   菜单的原理是这样的:

<div class="style7"   onclick=TestBlack("Div2")>2009年期刊内容</div>    
              <div   onmouseover="High()"   onmouseout="Low()"   id="Div2"   style="display:none"  >    
          <asp:LinkButton  ID="l2" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor="#7593C7" onclick="l2_Click">2009年第一卷第1期</asp:LinkButton>   
         <asp:LinkButton  ID="LinkButton6" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor=" #7593C7"  >2009年第一卷第2期</asp:LinkButton> 
          <asp:LinkButton  ID="LinkButton9" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor=" #7593C7" onclick="LinkButton9_Click" >2009年第一卷第3期</asp:LinkButton>  
    <asp:LinkButton  ID="LinkButton10" runat="server" class="classItem" Width="180" ForeColor="White" 
                      BackColor=" #7593C7" onclick="LinkButton10_Click" >2009年第一卷第4期</asp:LinkButton>    
                              </div> 

用onclick调用JS函数TextBlack(),对id为“Div2”的块进行展开和隐藏操作,onmouseover和onmouseout也是调用JS函数设置展开的样式。
    这是没有展开时菜单的样式。
    这是点击菜单后展开的样子,我希望页面刷新后仍然保持像这样的状态。
    个人有个想法是用cookies来实现,可是看了很多JS还是不懂,这次时间比较紧没办法完整地去学。Ajax也是看了不知怎么用。希望各位大侠给小弟一点指引。

--------------------编程问答-------------------- 刷新后再次调用展开函数。。。。 --------------------编程问答-------------------- 请问在哪里调用?后台吗? --------------------编程问答-------------------- 前台。。。。。onload="" --------------------编程问答--------------------
引用 4 楼 timzhufaith 的回复:
前台。。。。。onload=""

--------------------编程问答-------------------- 不行啊,有错误的,显示字符太多了。 --------------------编程问答-------------------- 你加在哪里的。。。 --------------------编程问答--------------------
引用 7 楼 timzhufaith 的回复:
你加在哪里的。。。
上面那个编译错误,有一行红色的,在红色下面那一行有个onclick,就加在里面。
<asp:LinkButton  ID="LinkButton7" runat="server" class="classItem" Width="180" ForeColor="White" BackColor="#7593C7" onclick="TestBlack('Div1');LinkButton7_Click">2008年第一卷第1期</asp:LinkButton> 

这个Linkbutton是点击的时候就执行后台的Redirect()进行传值,页面刷新以后,我的iframe才能读到值。你说刷新以后再调用一次隐藏函数,不是在点击的时候一并执行吗?
补充:.NET技术 ,  ASP.NET
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,