2 dreawer jilejun Dreawer_jilejun 于 2016.09.06 18:28 提问

再次点击下箭头的时候怎么使二级菜单移除?
 function combox(json){

    var obj=$("#"+json.id);//保存下拉列表DIV控件
    obj.children().hide();
    //判断json参数是否传入了可选参数
    var backgroundColor=json.backgroundColor==null ? "#e0e0e0": json.backgroundColor;
    var fontSize=json.fontSize==null ? "14px": json.fontSize;
    var fontFamily=json.fontFamily==null ? "黑体": json.fontFamily;
    var color=json.color==null ? "#000000": json.color;
    //var order=json.order==null ? "asc": json.order;

    obj.css({
        "height":json.height+"px",
        "width":json.width+"px",
        "background-color":backgroundColor,
        "font-size":fontSize+"px",
        "font-family":fontFamily,
        "color":color,
        "border-radius":"3px",
        "border":"solid 1px #969696",
        "box-shadow":"#444444 0 1px 1px 0",
        "cursor":"pointer",
        "-webkit-user-select":"none",
    });
    //向列表图层添加两个DIV
    obj.append("<div id='comboxLeft'>");
    obj.append("<div id='comboxRight'>");
    //设置新添DIV的CSS样式
    var comboxLeft=$("#comboxLeft");
    var comboxRight=$("#comboxRight");
    var comboxIMG=$("#comboxIMG");
    comboxLeft.css({
        "height":"100%",
        "width":"169px",
        "float":"left",
        "line-height":json.height+"px",
        "text-indent":"10px",
        "border-right":"solid 1px #969696",
        "cursor":"pointer",
        "-webkit-user-select":"none",
    });
    comboxRight.css({
        "height":"100%",
        "width":"30px",
        "float":"left",
        "cursor":"pointer",
        "-webkit-user-select":"none",
    });
    //把左边DIV内容设成第一个选项的内容
    comboxLeft.text(obj.children("a:eq(0)").text());
    //给右边DIV添加图片
    comboxRight.append("<img id='comboxIMG' src='img/jiantou.png'>");
    $("#comboxRight img").css({
        "margin-top":"3px",
        "margin-left":"3px" 
    })
    //为下拉列表添加点击事件
    obj.click(function(){
        //删除弹出列表DIV图层
        $("#comboxList").remove();
        //添加弹出列表DIV图层
        obj.after("<div id='comboxList'>");
        //获取combox顶点坐标
        var x=obj.offset().top;
        var y=obj.offset().left;
        //设置弹出列表DIV图层位置及样式
        $("#comboxList").css({
            "position":"absolute",
            "top":y+json.height+"px",
            "left":x+"px",
            "z-index":1,
            "width":json.width+"px",
            "border-right":"solid 1px #969696",
            "border-left":"solid 1px #969696",
            "border-bottom":"solid 1px #969696",
            "line-height":json.height+"px",
            "text-indent":"10px",
            "font-size":fontSize,
            "cursor":"pointer",
            "-webkit-user-select":"none",
        });
        //clone()克隆
        $("#comboxList").append(obj.children("a").clone());//想弹出的列表项添加内容
        //$("$comboxList").children("a").show();//显示A标签
        //姜a标签设置成block模型
        $("#comboxList").children("a").css({
            "display":"block"
        });
        //为列表项添加点击事件
        $("#comboxList").children("a").click(function(){
            $("#comboxLeft").text($(this).text());
            //删除列表图层
            $("#comboxList").remove();
        });
        //为鼠标添加移入事件
        $("#comboxList").children("a").mouseover(function(){
            $(this).css({
                "background-color":"#f0f0f0",

            });
        });
        //为鼠标添加移出事件
        $("#comboxList").children("a").mouseout(function(){
            $(this).css({
                "background-color":"#ffffff",   
            });
        });

    });
    $(document).click(function(event){

        var id=event.target.id;
        if(id=="kungfo"||id=="comboxLeft"||id=="comboxRight"||id=="comboxIMG"){
            return;
        }else{
            $("#comboxList").remove();
        }   
    })
};

图片说明

有网友是这样这样说的,不知道是对是错!

1个回答

dabocaiqq
dabocaiqq   2017.02.13 23:58
Csdn user default icon
上传中...
上传图片
插入图片