各位老大十万火急求救！

<div>技术部
           <div>张</div>
  <div>李</div>
  <div>王</div>
  </div>
   <div>业务部
           <div>百</div>
  <div>钱</div>
  <div>书</div>
  </div>
   <div>市场部
           <div>了</div>
  <div>的</div>
  <div>他</div>
  </div>
技术部和市场部这两个大类可以移动就说市场部可以移到技术部的上面
那市场部的了，的，他也可以互相移动但是只能在市场部这个层里移动 JS怎么实现急呀老大们帮帮我拜托了

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

天, 早知道不参一脚, 弄了一小时才实现大类的上下移, 子类我不干了, 这不是人干的, 太费时间了. <!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=utf-8" />
<title>shawl.qiu template</title>
<style type="text/css">
/* <![CDATA[ */
div{border:1px solid blue; padding:5px; margin:2px 0px;}
/* ]]> */
</style>
<script type="text/javascript">
//<![CDATA[
if (navigator.appName=="Microsoft Internet Explorer") {
//最大化窗口
self.moveTo(-5,-5)
self.resizeTo(screen.availWidth +8,screen.availHeight+8)
//这个脚本定义的宽度其实比原窗口还要大那么一点.
}
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
onload=function(){
fAtchPrnt('div');
}
function fAtchPrnt(tag){
var j=0;
var o=document.getElementsByTagName(tag);
for(var i=0; i<o.length; i++){
if(o[i].parentNode.tagName=='BODY'){
if(navigator.appName=='Microsoft Internet Explorer')
o[i].id='parent_'+ j;
else o[i].setAttribute('id', 'parent_'+ j);

fAtchOpt('parent_order', j, o[i].firstChild.data, o[i].getAttribute('id'));
j++;
//alert(o[i].firstChild.data);
}
}
//alert(document.body.innerHTML);
}

function fAtchOpt(id, order, text, value){
var o=document.getElementById(id);
o.size=order+1;
if(order==0)
o.options[order]=new Option(text, value, true, true);
else o.options[order]=new Option(text, value);
}

function fMoveParent(id, move){
var o=document.getElementById(id)
var offset=0;
var over=o.size-1;
var curt=o.selectedIndex;

if(move=='up'){
if(curt>0){

var oTemp=document.getElementById(o.options[curt].value)
var oTemp_=document.getElementById(o.options[curt-1].value)
var oP=document.getElementById(o.options[curt].value).parentNode;

oP.insertBefore(oTemp, oTemp_)

var temp=o.options[curt];
o.insertBefore(temp, o.options[curt-1])
}
} else {
if(curt<over){
var oTemp=document.getElementById(o.options[curt].value)
var oTemp_=document.getElementById(o.options[curt+1].value)
var oP=document.getElementById(o.options[curt].value).parentNode;

oP.replaceChild(oTemp, oTemp_);
oP.insertBefore(oTemp_, oTemp);

var temp=o.options[curt];
var temp_=o.options[curt+1];

o.replaceChild(temp, o.options[curt+1]);
o.insertBefore(temp_, temp);
}
}
}
//]]>
</script>
</head>
<body>
<select multiple="multiple" id="parent_order">

</select>
<br /><button onclick="fMoveParent('parent_order', 'up')">上移</button>
  <button onclick="fMoveParent('parent_order', 'down')">下移</button>
<div>技术部
<div>张</div>
<div>李</div>
<div>王</div>
</div>
<div>业务部
<div>百</div>
<div>钱</div>
<div>书</div>
</div>
<div>市场部
<div>了</div>
<div>的</div>
<div>他</div>
</div>
</body>
</html>
哈哈, 刚才找时间顺道把子类也解决了, 子类不到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=utf-8" />
<title>shawl.qiu template</title>
<style type="text/css">
/* <![CDATA[ */
div{border:1px solid blue; padding:5px; margin:2px 0px;}
/* ]]> */
</style>
<script type="text/javascript">
//<![CDATA[
if (navigator.appName=="Microsoft Internet Explorer") {
//最大化窗口
self.moveTo(-5,-5)
self.resizeTo(screen.availWidth +8,screen.availHeight+8)
//这个脚本定义的宽度其实比原窗口还要大那么一点.
}
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
onload=function(){
fAtchPrnt('main', 'div');
fChildren_ele('parent_order', 'children_order');
}
function fAtchPrnt(tagId, tag){
var j=0;
var o=document.getElementById(tagId).getElementsByTagName(tag);
for(var i=0; i<o.length; i++){
if(o[i].parentNode.id==tagId){
if(navigator.appName=='Microsoft Internet Explorer')
o[i].id='parent_'+ j;
else o[i].setAttribute('id', 'parent_'+ j);

fAtchOpt('parent_order', j, o[i].firstChild.data, o[i].getAttribute('id'));
j++;
//alert(o[i].firstChild.data);
}
}
//alert(document.body.innerHTML);
}

function fAtchOpt(id, order, text, value){
var o=document.getElementById(id);
o.size=order+1;
if(order==0)
o.options[order]=new Option(text, value, true, true);
else o.options[order]=new Option(text, value);
}

function fMoveParent(id, move){
var o=document.getElementById(id)
var offset=0;
var over=o.size-1;
var curt=o.selectedIndex;

if(move=='up'){
if(curt>0){
var oTemp=document.getElementById(o.options[curt].value)
var oTemp_=document.getElementById(o.options[curt-1].value)
var oP=document.getElementById(o.options[curt].value).parentNode;

oP.insertBefore(oTemp, oTemp_)

var temp=o.options[curt];
o.insertBefore(temp, o.options[curt-1])
}
} else {
if(curt<over){
var oTemp=document.getElementById(o.options[curt].value)
var oTemp_=document.getElementById(o.options[curt+1].value)
var oP=document.getElementById(o.options[curt].value).parentNode;

oP.replaceChild(oTemp, oTemp_);
oP.insertBefore(oTemp_, oTemp);

var temp=o.options[curt];
var temp_=o.options[curt+1];

o.replaceChild(temp, o.options[curt+1]);
o.insertBefore(temp_, temp);
}
}
}

function fChildren_ele(id, idCld){
var o=document.getElementById(id);
var oIndex=o.selectedIndex;

var oCld=document.getElementById(idCld)
oCld.length=0;

var obj=document.getElementById(o.options[o.selectedIndex].value)
var objCld=obj.getElementsByTagName('div');

for(var i=0; i<objCld.length; i++){
if(navigator.appName=='Microsoft Internet Explorer')
objCld[i].id=obj.id+'_'+i
else objCld[i].setAttribute('id', obj.id+'_'+i);

fAtchOpt('children_order', i, objCld[i].firstChild.data, objCld[i].getAttribute('id'));
}
//alert(document.body.innerHTML);
}

//]]>
</script>
</head>
<body><div id="inline">
<select multiple="multiple" id="parent_order" onchange="fChildren_ele('parent_order', 'children_order');">

</select>
<br /><button onclick="fMoveParent('parent_order', 'up')">上移</button>
<button onclick="fMoveParent('parent_order', 'down')">下移</button>
</div>
<div id="inline">
<select multiple="multiple" id="children_order">
</select>
<br /><button onclick="fMoveParent('children_order', 'up')">上移</button>
<button onclick="fMoveParent('children_order', 'down')">下移</button>
</div>
<div id="main">
<div>技术部
<div>张</div>
<div>李</div>
<div>王</div>
</div>
<div>业务部
<div>百</div>
<div>钱</div>
<div>书</div>
</div>
<div>市场部
<div>了</div>
<div>的</div>
<div>他</div>
</div>
</div>
</body>
</html>