📄 default.aspx
字号:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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 runat="server">
<title>无标题页</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function listmenu()
{
//首先判断菜单是否是展开状态
var menudom=document.getElementById("menu");
//如果未展开，则调用服务器端数据，如果已展开，则隐藏数据
if(menudom.style.display=="none" || menudom.style.display =="")
{
//获取服务器端数据的方法
getData();
menudom.style.display="list-item";
}
else
{
menudom.style.display="none";
}
}
//创建异步获取对象
var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
function getData()
{
//状态发生变化时关联的方法
xmlhttp.onreadystatechange=statechange;
//异步加载服务器端数据
xmlhttp.open("GET","DataPage.aspx",true);
xmlhttp.send(null);
}
function statechange()
{
if(xmlhttp.readystate==4)
{
if(xmlhttp.status==200)
{
//异步获取已经完成，并且是成功状态时，显示获取的数据
SplitData(xmlhttp.responseText);
}
}
}
function SplitData(str)
{
var indexofstr;
var menuarray="";
//切割传递来的字符串
while(str.length>0)
{
//判断是否是最后一个字符串
indexofstr=str.indexOf(",");
if(indexofstr >0)
{
menuarray=menuarray+str.substring(0,indexofstr);
str=str.substring(indexofstr+1);
menuarray=menuarray+"<br/>";
}
else
{
// 如果是最后一个字符串
menuarray=menuarray+str.substring(0,4);
menuarray=menuarray+"<br/>";
break;
}
}
document.getElementById("menu").innerHTML=menuarray;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div style="font-size:x-large;text-align: center; ">
使用Ajax+CSS实现的动态菜单功能
</div>
<div class="menutop" onclick="listmenu()">网站功能</div>
<div class="menulist" id="menu"></div>
</form>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -