首页 新闻 论坛 群组 Blog 文档 下载 读书 Tag 网摘 搜索 .NET Java 游戏 视频 人才 外包 培训 数据库 书店 程序员
中国软件网
欢迎您:游客 | 登录 注册 帮助
    • javascript二级联动的问题,在线等 [已结贴,结贴人:shaochengtian]
    进入用户个人空间
    加为好友
    发送私信
    在线聊天
    发表于：2008-05-17 14:19:36 楼主
    我想做个联动菜单,可是总是不对,子菜单难以对应到主菜单的选项,而且更换了主菜单之后子菜单并不会随之更换,而是把上次主菜单对应的菜单也保留下来了,请问怎么回事
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta content="text/html; charset=gb2312" http-equiv="Content-Type" />
        <title>商品管理 </title>
        <link href="css.css" rel="stylesheet" type="text/css" />
        <style type="text/css">
        body{margin:0 auto 0;background:#6CF;text-align:center;}
        ul{list-style:none;}
        #PageBody{margin:0 auto 0;}
        #addmerchandise{width:420px;min-height:590px;border:10px solid #F8F6F3;text-align:left;position:absolute;top:0px;left:300px;background:#FFF;}
        #addmerchandise{filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=75)}
        #merchandiseIntro{vertical-align:top;}
        #mer_num,#mer_name,#mer_type,#mer_price{width:150px;line-height:30px;color:red;}
        #showMerchandise{background:#FFF;margin:0 auto 0;width:800px;}
        #showMerchandise ul{border-top:1px solid #F00;border-left:1px solid #F00;float:left;margin:0 auto 0;width:800px;background:#FF0;}
        #showMerchandise li{border-right:1px solid #F00;float:left;border-bottom:1px solid #F00;width:110px;}
        .die{display:none;}
        .active{}
        #line{width:780px;height:20px;background:#fff;border-bottom:1px solid #F00;}
        #CenterLayer{cursor:url('1.ani');background:#000;position:absolute;left:0;top:0;filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=50)}

        </style>

        <script type="text/javascript">
            document.onkeydown=function()
            {          if(event.keyCode==27)
                {
                    if(document.getElementById("addmerchandise").className=="die")
                            showDiv();
                    else
                            CloseDiv();
                }
            }
            function showDiv()
                  {
                    document.getElementById("addmerchandise").className="active";
                    //document.theForm.merchandiseName.focus();
                            //－－－－－－－－－－－－－－－－－－－－－－－－－－－－
                            //设置CenterLayer
                            if(document.getElementById("CenterLayer").className=="die")
                            document.getElementById("CenterLayer").className="active";
                            var DivWidth=document.body.clientWidth;//获取网页宽度
                            var DivHeight=document.body.clientHeight;//获取网页高度
                            if(DivHeight <window.screen.height)
                            DivHeight=window.screen.height;
                            var Div=document.getElementById("CenterLayer");
                            Div.style.width=DivWidth;
                            Div.style.height=DivHeight;
                  }
            function CloseDiv()
                {
                    document.getElementById("addmerchandise").className="die";
                    document.getElementById("CenterLayer").className="die"
                }
            function createNum()
            {
                var thistime=new Date();
                var year=thistime.getFullYear();
                var month=thistime.getMonth()+1;
                var day=thistime.getDate();
                var hours=thistime.getHours();
                var minutes=thistime.getMinutes();
                var second=thistime.getSeconds();
                if(month <10)
                month="0"+month;
                if(day <10)
                day="0"+day;
                if(hours <10)
                hours="0"+hours;
                if(minutes <10)
                minutes="0"+minutes;
                if(second <10)
                second="0"+second;
                var num=year+month+day+hours+minutes+second;
                document.theForm.merchandiseNum.value=num;
                showDiv();
            }
                            var sort1=new Array("T恤","衬衫","西装","皮带","领带","男包","皮鞋","男士内衣");
                            var sort2=new Array("靴子","布鞋","高跟鞋","工作服","量身定做","中老年服饰","孕期用品");
                            var sort3=new Array("奶粉","孕妇装","玩具","营养保健","护腰枕");
                            var sort4=new Array("头饰","剃须刀","梳子","帽子","情侣饰品","化装品");
                            var sort5=new Array("中央空调","厨房电器","电动车","自行车","摩托","汽车","车饰");
                            var sort6=new Array("诺基亚","三星","摩托罗拉","天语","IBM","联想","惠浦","宏基","神州");
                            var sort7=new Array("数码单反","胶卷相机","配件","闪光灯","镜头","闪光灯","三角架","冲印");
                            var sort8=new Array("MP3/MP4","录音笔","学习机","眼镜","钢琴","电子词典");

            function showSort(num)
                {
                merchandiseSort=document.all["merchandiseSort"];
                var arr=[sort1,sort2,sort3,sort4,sort5,sort6,sort7,sort8]
                    for(i=0;i <arr[num][i].length;i++)
                    {
                        var oOption=document.createElement("option");
                        merchandiseSort.options.add(oOption);
                        oOption.innerHTML=arr[num][i]
                        oOption.value="2"
                    }
            }
           
        </script>


    </head>
    <body onload="createNum();">
        <div id="mainbox">
            <div id="PageBody">
                <div id="CenterLayer" onclick="CloseDiv();"> </div>
                <div id="addmerchandise" class="die">
                <h5>增加商品 </h5>
                    <form action="merchandiseAdd.asp"  method="post" name="theForm">
                        <ul>
                            <li>商品编号： <input name="merchandiseNum" readonly type="text" /> <span id="mer_num">c </span> </li>
                            <li>商品名称： <input name="merchandiseName" style="width: 200px" type="text" /> <span id="mer_name">a </span> </li>
                            <li>商品品牌： <input name="merchandiseBrand" /> </li>
                            <li>商品频道：
                                <select onchange="showSort(this.value)">
                                <option value="1">流行女装 ¦
                                        职业装 ¦
                                        女包 ¦
                                        </option> <option value="2">男装 ¦
                                        男鞋 ¦
                                        手表 ¦
                                        </option> <option value="3">女鞋 ¦
                                        运动鞋 ¦
                                        童装 ¦
                                        </option> <option value="4">母婴用品 ¦
                                        儿童服饰 ¦
                                        </option> <option value="5">珠宝 ¦
                                        饰品 ¦
                                        个人护理 ¦
                                        箱包 ¦
                                        </option> <option value="6">交通工具 ¦
                                        家电 ¦
                                        </option> <option value="7">手机 ¦
                                        笔记本电脑 ¦
                                        配件 ¦
                                        </option>
                                  </select>
                            </li>
                            <li>
                                商品分类:
                                        <select name="merchandiseSort">
                                           
                                        </select>
                            </li>
                            <li>商品价格： <input name="merchandisePrice" onblur="checknum();" /> <span id="mer_price"> </span> </li>
                            <li>商品图片： <input name="uploadPhoto" type="file" /> </li>
                            <li> <span id="merchandiseIntro">商品介绍： </span> <textarea name="merchandiseIntro" style="width: 404px; height: 368px"> </textarea> </li>
                            <li>
                                <input name="tijiao" type="submit" value="提交" />
                                <input type=button value="清空" onclick="javascript:document.theForm.reset();createNum();" /> </li> </ul>
                    </form>
              </div>
             
            </div>
        </div>
    </body>
    </html>
    20  修改 删除 举报 引用 回复
    进入用户个人空间
    加为好友
    发送私信
    在线聊天
    发表于：2008-05-17 14:31:011楼 得分:0
    HTML code
    
<html>
<head><title>041501</title>
<script type='text/javascript' src='js/objectMessage.js'></script>
</head>
var aProvince=new Array('四川','湖南','贵州','河北','山东','福建','广东');
var aCity=new Array(
    new Array('内江','成都','自贡','南充','宜宾','乐山','温江'),
    new Array('长沙','韶山','冲'),
    new Array('贵州','贵阳','其他'),
    new Array('河北1','河北2','河北3'),
    new Array('山东2','山东1','山东3'),
    new Array('福州','厦门','海口'),
    new Array('广州','东莞','汕头')
);

function $(obj) {return document.getElementById(obj);}//简化方法

function defaultLoad(){
    var oProvince=$("province");
    var oCity=$("city");
    
    loadProvince(oProvince);
    loadCity(oCity,0);
}

function loadProvince(oProvince) {
    for(var i=0; i<aProvince.length; i++){
        if(!n_Option)
            var n_Option=document.createElement('option');
        n_Option.value=i;
        n_Option.text=aProvince[i];
        oProvince.options.add(n_Option);
        n_Option=null;
    }

}

function loadCity(oCity,index) {
    for(var i=0; i< aCity[index].length; i++) {
        if(!n_Option)
            var n_Option=document.createElement('option');
        n_Option.value=i;
        n_Option.text=aCity[index][i];//二维数组运用
        oCity.options.add(n_Option);//添加option
        n_Option=null;    
    }

}

window.onload=function(){

defaultLoad();
$("province").onchange=changeProvince;

};


function changeProvince(){
    var iProvince=$("province").selectedIndex;
    var oCity=$("city");
    oCity.options.length=0;//清空很重要
    loadCity(oCity,iProvince);

}

</script>

省份：<select id='province'></select>
城市：<select id='city'></select><br/>
</body>
</html>


    改下内容就可以了
    修改 删除 举报 引用 回复
    进入用户个人空间
    加为好友
    发送私信
    在线聊天
    发表于：2008-05-17 22:28:182楼 得分:20
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    //省略一部分 因为提示回复内容过长
        <script type="text/javascript">
            document.onkeydown=function()
            {          if(event.keyCode==27)
                {
                    if(document.getElementById("addmerchandise").className=="die") 
                            showDiv();
                    else
                            CloseDiv();
                }
            }
            function showDiv()
                  {
                    document.getElementById("addmerchandise").className="active";
                    //document.theForm.merchandiseName.focus();
                            //－－－－－－－－－－－－－－－－－－－－－－－－－－－－
                            //设置CenterLayer
                            if(document.getElementById("CenterLayer").className=="die")
                            document.getElementById("CenterLayer").className="active";
                            var DivWidth=document.body.clientWidth;//获取网页宽度
                            var DivHeight=document.body.clientHeight;//获取网页高度
                            if(DivHeight <window.screen.height)
                            DivHeight=window.screen.height;
                            var Div=document.getElementById("CenterLayer");
                            Div.style.width=DivWidth;
                            Div.style.height=DivHeight;
                  }
            function CloseDiv()
                {
                    document.getElementById("addmerchandise").className="die";
                    document.getElementById("CenterLayer").className="die"
                }
            function createNum()
            {
                var thistime=new Date();
                var year=thistime.getFullYear();
                var month=thistime.getMonth()+1;
                var day=thistime.getDate();
                var hours=thistime.getHours();
                var minutes=thistime.getMinutes();
                var second=thistime.getSeconds();
                if(month <10)
                month="0"+month;
                if(day <10)
                day="0"+day;
                if(hours <10)
                hours="0"+hours;
                if(minutes <10)
                minutes="0"+minutes;
                if(second <10)
                second="0"+second;
                var num=year+month+day+hours+minutes+second;
                document.theForm.merchandiseNum.value=num;
                showDiv();
            }
                            var sort1=new Array("T恤","衬衫","西装","皮带","领带","男包","皮鞋","男士内衣");
                            var sort2=new Array("靴子","布鞋","高跟鞋","工作服","量身定做","中老年服饰","孕期用品");
                            var sort3=new Array("奶粉","孕妇装","玩具","营养保健","护腰枕");
                            var sort4=new Array("头饰","剃须刀","梳子","帽子","情侣饰品","化装品");
                            var sort5=new Array("中央空调","厨房电器","电动车","自行车","摩托","汽车","车饰");
                            var sort6=new Array("诺基亚","三星","摩托罗拉","天语","IBM","联想","惠浦","宏基","神州");
                            var sort7=new Array("数码单反","胶卷相机","配件","闪光灯","镜头","闪光灯","三角架","冲印");
                            var sort8=new Array("MP3/MP4","录音笔","学习机","眼镜","钢琴","电子词典");

            function showSort(num)
                {
                merchandiseSort=document.all["merchandiseSort"]; //最好改用document.getElementById
                var arr=[sort1,sort2,sort3,sort4,sort5,sort6,sort7,sort8]
    for(var i=merchandiseSort.length-1;i>=0;i--){
    merchandiseSort.options[i]=null;
    }
                    for(i=0;i <arr[num].length;i++)
                    {
    //                    var oOption=document.createElement("option");
    //                    merchandiseSort.options.add(oOption);
    //                    oOption.innerHTML=arr[num][i]
    //                    oOption.value="2"
    var newOption=new Option(arr[num][i]);
    merchandiseSort.options[merchandiseSort.length]=newOption;
                    }
            }
             
        </script>


    </head>
    <body onload="createNum();">
        <div id="mainbox">
            <div id="PageBody">
                <div id="CenterLayer" onclick="CloseDiv();"> </div>
                <div id="addmerchandise" class="die">
                <h5>增加商品 </h5>
                    <form action="merchandiseAdd.asp"  method="post" name="theForm">
                        <ul>
                            <li>商品编号： <input name="merchandiseNum" readonly type="text" /> <span id="mer_num">c </span> </li>
                            <li>商品名称： <input name="merchandiseName" style="width: 200px" type="text" /> <span id="mer_name">a </span>

    </li>
                            <li>商品品牌： <input name="merchandiseBrand" /> </li>
                            <li>商品频道：
                                <select onchange="showSort(this.options[this.selectedIndex].value)">
                                <option value="1">流行女装 ¦
                                        职业装 ¦
                                        女包 ¦
                                        </option> <option value="2">男装 ¦
                                        男鞋 ¦
                                        手表 ¦
                                        </option> <option value="3">女鞋 ¦
                                        运动鞋 ¦
                                        童装 ¦
                                        </option> <option value="4">母婴用品 ¦
                                        儿童服饰 ¦
                                        </option> <option value="5">珠宝 ¦
                                        饰品  ¦
                                        个人护理 ¦
                                        箱包 ¦
                                        </option> <option value="6">交通工具 ¦
                                        家电 ¦
                                        </option> <option value="7">手机 ¦
                                        笔记本电脑 ¦
                                        配件 ¦
                                        </option>
                                    </select>
                            </li>
                            <li>
                                商品分类:
                                        <select name="merchandiseSort">
                                           
                                        </select>
                            </li>
                            <li>商品价格： <input name="merchandisePrice" onblur="checknum();" /> <span id="mer_price"> </span> </li>
                            <li>商品图片： <input name="uploadPhoto" type="file" /> </li>
                            <li> <span id="merchandiseIntro">商品介绍： </span> <textarea name="merchandiseIntro" style="width: 404px; height:

    368px"> </textarea> </li>
                            <li>
                                <input name="tijiao" type="submit" value="提交" />
                                <input type=button value="清空" onclick="javascript:document.theForm.reset();createNum();" /> </li> </ul>
                    </form>
                </div>
               
            </div>
        </div>
    </body>
    </html>
    修改 删除 举报 引用 回复
    进入用户个人空间
    加为好友
    发送私信
    在线聊天
    发表于：2008-05-17 22:28:573楼 得分:0
    看看 差不多应该就是这样了
    修改 删除 举报 引用 回复
    进入用户个人空间
    加为好友
    发送私信
    在线聊天
    发表于：2008-05-17 22:36:324楼 得分:0
    注意：数组是从0开始的 不是1 所以你下边的这个要做相应的调整

    HTML code
    
<option value="0">流行女装 ¦ 
                                    职业装 ¦ 
                                    女包 ¦ 
                                     </option> <option value="1">男装 ¦ 
                                    男鞋 ¦ 
                                    手表 ¦ 
                                     </option> <option value="2">女鞋 ¦ 
                                    运动鞋 ¦ 
                                    童装 ¦ 
                                     </option> <option value="3">母婴用品 ¦ 
                                    儿童服饰 ¦ 
                                     </option> <option value="4">珠宝 ¦ 
                                    饰品  ¦ 
                                    个人护理 ¦ 
                                    箱包 ¦ 
                                     </option> <option value="5">交通工具 ¦ 
                                    家电 ¦ 
                                     </option> <option value="6">手机 ¦ 
                                    笔记本电脑 ¦ 
                                    配件 ¦ 
                                     </option>


    另外数组的值和这个选项的值对应也出现了混乱 反正我是没怎么看懂
    修改 删除 举报 引用 回复
    进入用户个人空间
    加为好友
    发送私信
    在线聊天
    发表于：2008-05-18 23:57:545楼 得分:0
    jf
    修改 删除 举报 引用 回复
    网站简介－广告服务－网站地图－帮助－联系方式－诚聘英才－English－ 问题报告
    北京创新乐知广告有限公司 版权所有 京 ICP 证 070598 号
    世纪乐知(北京)网络技术有限公司 提供技术支持
    Copyright © 2000-2008, CSDN.NET, All Rights Reserved