jquery实现元素平面移动

这次给大家带来jquery实现元素平面移动，jquery实现元素平面移动的注意事项有哪些，下面就是实战案例，一起来看一下。

最近再做报表时候，直接把全部字段都导出了，但这不太灵活。回忆老师讲过的项目做报表如下左右上下移功能灵活控制，所以就尝试下咯。

js代码

function selected(thiz) 
{ 
 var name = thiz.name; 
 if(name=="right") 
  $("select[name='left']").val(""); 
 else 
  $("select[name='right']").val(""); 
} 
function Shift(thiz) 
{ 
 var right = $("select[name='right']"); 
 var left = $("select[name='left']"); 
 if(thiz=="left" && right.val() != ""){ 
  lrShift(right,left); 
 }else if(thiz=="right" && left.val() != ""){ 
  lrShift(left,right); 
 } 
 
 //获取选中的值 
} 
//从dest移动到target 
function lrShift(dest,target) 
{ 
 var childrens = dest.children(); 
 var args = ""; 
 //alert(dest.val()); 
 var dests = dest.val() 
 for(var x = 0; x "+vaTemp+"");//追加 
  target.find("option[value='"+vaTemp+"']").attr("selected",true);//给追加获取焦点 
  for(var y = 0; y <childrens.length function> childrens.length-1) 
    return; 
   temp = childrens.get(number); 
  } 
 
  //删除选中的值 
  var n = 0; 
  var buffer = new Array(childrens.length-objData.length); 
  for(var x = 0; x "+objData[x]+""); 
     } 
    } 
    obj.append("<option>"+buffer[y]+"</option>"); 
   } 
  }else{ 
   for(var y = 0; y "+buffer[y]+""); 
    if(buffer[y]==temp.value) 
    { 
     for(var x = 0; x "+objData[x]+""); 
     } 
    } 
   } 
  } 
  //选中值 
  obj.val(objData); 
} 
function findSelect(selects,objValue) 
{ 
 var number = -1; 
 for(var x = 0; x <p style="text-align: left;">页面调用</p>
<pre class="brush:php;toolbar:false"><p> 
  </p><p> 
   <b>未导出字段</b> 
  </p> 
  <p> 
   <select> 
    <option>姓名</option> 
    <option>快件号</option> 
    <option>快递公司</option> 
    <option>首重</option> 
    <option>续重</option> 
   </select> 
  </p> 
  
 <p> 
  </p><p>
   <input>
  </p> 
  <p>
   <input>>" onclick="Shift('right')"/>
  </p> 
  
 <p> 
  </p><p> 
   <b>需导出字段</b> 
  </p> 
  <p> 
   <select> 
    <option>首价</option> 
    <option>续价</option> 
    <option>大大</option> 
    <option>小小</option> 
   </select> 
  </p> 
  
 <p> 
  </p><p>
   <input>
   </p> 
  <p>
   <input>
  </p> 
 

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

nodejs日志模块winston使用方法总结

VueJs中V-bind指令怎样使用

以上是jquery实现元素平面移动的详细内容。更多信息请关注PHP中文网其他相关文章！