jQuery实现调整表格单列顺序完整实例

本文实例讲述了jQuery实现调整表格单列顺序的方法。分享给大家供大家参考，具体如下：

 
  
  
  
  
   #main{
    width:800px;
    height:400px;
    margin:auto;
    text-align:center;
    border:1px solid red;
    background:#eee;
    padding-top:100px;
   }
   #tabf{
    height:170px;
    position:relative;
   }
   #showDetail{
    left:244px;
    width:20px;
    height:15px;
    line-height:15px;
    border-left:1px solid blue;
    border-top:1px solid blue;
    border-right:1px solid blue;
    cursor:pointer;
    display:none;
    position:absolute;
   }
   #tab{
    margin-top:16px;
    border-collapse:collapse;
    position:absolute;
   }
   #tab td{
    height:50px;
    width:50px;
    line-height:50px;
    border:1px solid blue;
   }
   #sortTab{
    width:170px;
    height:155px;
    border:3px outset;
    background:#ccc;
    position:absolute;
    top:15px;
    left:270px;
    display:none;
   }
   #tdList{
    width:90px;
    height:150px;
    border:1px inset;
    position:absolute;
   }
   #opt{
    width:80px;
    height:150px;
    position:absolute;
    left:90px;
   }
   .btn{
    margin:10px;
    width:60px;
    height:20px;
   }
  
  
 
 
  
   
    >
    

     

      
a
b
c
d
e
     
     

      

     
     

      

     
    
    
     
     
      

      

     
    
   
  
 

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery表格(table)操作技巧汇总》、《jQuery常用插件及用法总结》、《jquery中Ajax用法总结》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。