访优快云功能的动态二级菜单_csdn 菜单-优快云博客

本文链接：https://blog.youkuaiyun.com/ccaakkee/article/details/1999664

本文介绍了一个使用JavaScript实现的层显示控制方法，并结合AJAX进行后台数据异步加载的技术方案。该方案能够根据用户操作显示或隐藏指定的HTML元素，并通过AJAX请求动态更新元素的内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

以下是整理的代码

C# code

   
   
    
    
    
    

    
    <
    
    script type
    
    =
    
    "
    
    text/javascript
    
    "
    
    >
    
    
    var isIe
    
    =
    
    navigator.appName.indexOf(
    
    "
    
    Microsoft
    
    "
    
    )
    
    !=-
    
    1
    
    ?
    
    true
    
    :
    
    false
    
    ; 
    
    //
    
    判断是不是IE    
    
    

    
        function showdiv(state)
    
    //
    
    控制层的显示
    
    

    
        { 
    var oDiv1
    
    =
    
    document.getElementById(
    
    "
    
    div1
    
    "
    
    );
     
    
    if
    
    (state)
     oDiv1.style.display
    
    =
    
    ""
    
    ;
     
    
    else
    
    
     oDiv1.style.display
    
    =
    
    "
    
    none
    
    "
    
    ;
    }
    function get_pos_x(obj)
    
    //
    
    获取层显示的X坐标
    
    

    
        {
    var x
    
    =
    
    obj.offsetLeft;
    
    
    while
    
    (obj.offsetParent){
        obj
    
    =
    
    obj.offsetParent;
        x
    
    +=
    
    obj.offsetLeft;
    }
     
    
    if
    
    (isIe)
    {
        
    
    return
    
     (x
    
    +
    
    90
    
    );
    }
    
    
    else
    
    
    {
        
    
    return
    
     (x
    
    +
    
    90
    
    ) 
    
    +
    
     
    
    "
    
    px
    
    "
    
    ;
    }  
    }
    function get_pos_y(obj)
    
    //
    
    获取层显示的Y坐标
    
    

    
       {
    var y
    
    =
    
    obj.offsetTop;
    
    
    while
    
    (obj.offsetParent){
        obj
    
    =
    
    obj.offsetParent;
        y
    
    +=
    
    obj.offsetTop;
    }
     
    
    if
    
    (isIe)
    {
        
    
    return
    
     y;
    }
    
    
    else
    
    
    {
        
    
    return
    
     y 
    
    +
    
     
    
    "
    
    px
    
    "
    
    ;
    }
    }
    function setPosition(obj,e,isShow,id){     
    
    //
    
    控制层的显示及AJAX的异步调用
    
    

    
         var oDiv
    
    =
    
    document.getElementById(
    
    "
    
    div1
    
    "
    
    );
        
    
    if
    
    (isShow){
       oDiv.style.top
    
    =
    
    get_pos_y(obj); 
    
    //
    
    y;
    
    

    
           oDiv.style.left
    
    =
    
    get_pos_x(obj); 
    
    //
    
    x;
    
    

    
            
    
    if
    
    (isShow) oDiv.style.display
    
    =
    
    ""
    
    ;
    }
    
    
    else
    
    
        oDiv.style.display
    
    =
    
    "
    
    none
    
    "
    
    ;
        
        var   webFileUrl   
    
    =
    
       
    
    "
    
    secondcategorys.aspx?id=
    
    "
    
    +
    
    id; 
　　           var   result   
    
    =
    
       
    
    ""
    
    ; 
　　           var xmlHttp;
               
    
    if
    
    (window.ActiveXObject) 
               xmlHttp   
    
    =
    
       
    
    new
    
       ActiveXObject(
    
    "
    
    MSXML2.XMLHTTP
    
    "
    
    ); 
               
    
    else
    
    
               xmlHttp   
    
    =
    
       
    
    new
    
       XMLHttpRequest();
　　           xmlHttp.open(
    
    "
    
    POST
    
    "
    
    ,   webFileUrl,   
    
    false
    
    );
    
    //
    
    使用XMLPOST方式 
    
    

    
    　　           xmlHttp.send(
    
    ""
    
    );
    
    //
    
    发送 
    
    

    
    　　           result   
    
    =
    
       xmlHttp.responseText;
    
    //
    
    得到返回的结果 
    
    

    
    　　            
    
    if
    
    (result   
    
    !=
    
       
    
    ""
    
    ) 
　　           { 
               oDiv.innerHTML
    
    =
    
    result; 
               }
                 
    
    else
    
     
　　           { 
　　　　           alert(
    
    "
    
    出错啦~~~~
    
    "
    
    ); 
　　           } 
　　           
    }
    
    
    </
    
    script
    
    >

C# code

   
   
    
    
    
    

    
    <
    
    div style
    
    =
    
    "
    
    filter:alpha(opacity=80);text-align:left;position:absolute;width:100px;height:auto;border:solid 1px #FFAEB9;top:100px;left:100px;display:none;background:#fff
    
    "
    
     
    id
    
    =
    
    "
    
    div1
    
    "
    
     onmouseover
    
    =
    
    "
    
    showdiv(true)
    
    "
    
      onmouseout
    
    =
    
    "
    
    showdiv(false)
    
    "
    
    >
    
    
    
    
    </
    
    div
    
    >
    
    //
    
    被控制显示的层，用来放置二级菜单

C# code

   
   
    
    
    
    

    
    //
    
    异步调用的后台处理
    
    

    
    gzDB 
    
    get
    
     
    
    =
    
     
    
    new
    
     gzDB();
            DataSet d 
    
    =
    
     
    
    get
    
    .GetSecondByCid(Request.QueryString[
    
    "
    
    id
    
    "
    
    ]);
            
    
    string
    
     admin 
    
    =
    
     
    
    "
    
    <b>
    
    "
    
    ;
            Response.Clear();
            
    
    foreach
    
     (DataRow r 
    
    in
    
     d.Tables[
    
    "
    
    news
    
    "
    
    ].Rows)
            {
                admin 
    
    +=
    
     
    
    "
    
    &nbsp;<a style='text-decoration: underline;' href=newsList.aspx?sId=
    
    "
    
     
    
    +
    
     r[
    
    "
    
    newsId
    
    "
    
    ] 
    
    +
    
     
    
    "
    
    >
    
    "
    
     
    
    +
    
     r[
    
    "
    
    newsName
    
    "
    
    ] 
    
    +
    
     
    
    "
    
    </a><br/>
    
    "
    
    ;
            }
            admin 
    
    +=
    
     
    
    "
    
    </b>
    
    "
    
    ;
            Response.Write(admin);
    
    //
    
    向HTTP输出内容流写入一个字符数组 
    
    

    
                Response.End();