经理要求用javascript实现如csdn首页的导航菜单,而且可以自己手动设置导航菜单的项数。即 我输入3,就生成3项例如:新闻,体育,财经。输入2就要生成2项,例如:新闻,财经。
本人刚刚学习asp.net,导航菜单都不知道怎么实现呢 。一下就要做一个可以动态设置项数的导航菜单,不要下拉菜单的。
请高手执教!!!

解决方案 »

  1.   

    asp.net2.0里面好像有控件可以实现类似的功能。
      

  2.   

    very simple.
    一个数组,一个循环,然后document.write
      

  3.   

    csdn那个也太简单了,不值得用什么菜单控件。你可以从工具栏拖近来一个DataList,绑定(设置DataSourceID)到SQL Server或者XML等,在SelectCommand上写类似“select top 3 [标题],url from [首页导航栏设置] order by [次序]”的查询。如果“top 3”需要由程序生成,也可以由程序给数据源的SelectCommand设置。然后设置绑定的字段为超链接。将交互操作全都调试好了,当然最后可以设置一下绑定中的样式。
      

  4.   

    楼上我大概明白你的意思,能不能给个例子 至于后台取数我会,就是前台让用javascript写
    还不让我从后台掉数据。不知道你明白我的意思不
      

  5.   

    写了个简单的给你:
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <style>
    .item{width:80px;height:20px;text-align:center;float:left;border:1px #000000 solid;}
    </style>
    <script language="javascript">
    var arr = new Array("<a href='#'>链接1</a>","<a href='#'>链接2</a>","<a href='#'>链接3</a>","<a href='#'>链接4</a>","<a href='#'>链接5</a>","<a href='#'>链接6</a>","<a href='#'>链接7</a>","<a href='#'>链接8</a>","<a href='#'>链接9</a>","<a href='#'>链接10</a>");
    function set()
    {
    var s = "";
    for(var i = 0; i < parseInt(document.getElementById("num").value); i++)
    {
    s += "<div class='item'>"+arr[i]+"</div>";
    }
    document.getElementById("main").innerHTML = s;
    }
    function chk()
    {
    if(document.getElementById("num").value != "" && r() && document.getElementById("num").value < 11 && document.getElementById("num").value > 0)
    {
    return true;
    }
    window.alert("请输入1-10之间的整数!");
    document.getElementById("num").focus();
    return false;
    }function r()
    {
    var myInt = /^\d*$/;
    if(myInt.test(document.getElementById("num").value))
    {
    return true;
    }
    window.alert("请输入数字!");
    document.getElementById("num").focus();
    return false;
    }
    </script>
    </head>
    <body>
    <form id="form1" name="form1" method="post" action="">
      输入导航栏数量:<input type="text" name="num" id="num" />
      <input type="button" name="ok" id="ok" value="OK" onclick="if(chk()){set();}" />
    </form>
    <div id="main"></div>
    </body>
    </html>