JS实现列表与多选框选择附预览动画

一功能预览

2html代码

span tr tdimg onclick=' addTYPe()' src=' http : $ { MsURl }/images/logo/add。巴布亚新几内亚产品范围：/TD TD选择id=' SelectTypeOne ' class=' easy ui-combobox '数据-选项='必选d : true '选项一级分类/option/select select id=' selectTypeTwo ' class=' measuri-combobox ' data-options=' required d : true '所选选项=' selected '全部/option/select/TD/tr高度=' 20px ' TD/TD TD TD id=' type three '/TD/tr tr高度=' 30px ' TD/TD TD TD TD span id=' type one result '/span span id=' type onesubresult '/span HR//TD/tr/span 3js代码

$('#selectTypeOne ').combobox({ URL : config。网址映射。类型列表，值字段： '名称'，文本字段： '名称'，必选：真的，宽度： '100 '，在select 3360函数(行)上{ typename 1=row。name $(' # type三').html(" ")；$('#typeOneResult ').html(" ")；$(' # typenenosubresult ').html(" ")；subTypeName=[]；$('#selectTypeTwo ').combobox({ URL : config。urlmap。类型列表？parent=' row.id，valueField : 'name '，textField : 'name '，width : '100 '，必选： true，在select :函数(行)上{ typename 2=typename 1 ' '行。姓名；$.getJSON(config.urlMap.typeList '？parent=' row.id，function(data){ var type thread name=' for(var I=0；一。数据。长度；I){ TYPe TripNAmE=' input onclick=cellTYPe(\ ' '数据[i].name ' \ ')name=' type three ' value=' data[I].名称' type='复选框' '数据[i].名称} $('#typeThree ').html(TYPe三个名称)；$('#typeOneResult ').html(type name 2 ' ')；$(' # typenenosubresult ').html(" ")；subTypeName=[]；});} }) } });}) //删除下标元素方式一数组。原型。remove=function(dx){ if(ISnan(dx)| | dx this。长度){ return false} for (var i=0，n=0；我这个长度；我){如果（这个[我]!=this[dx]){ this[n]=this[I]} } this。长度-=1 }//删除数组元素方式二数组。原型。Bao remove=function(dx){ if(ISnan(dx)| | dx this。长度){ return false} this.splice(dx，1)；} var SubTypename=[]；函数CellType(name){ var index=SubTypename。(名称)的索引if(索引==-1){ SubTypename。推送(名称)；} else { subTypeName.baoremove(索引);} $(' # typenenosubresult ').html(subTypeName.join('，'))；}