首页>>Jquery文字>>元素内容拖拽(2019-04-25)

元素内容拖拽

元素拖动，可以删除已经拖动后的元素

元素内容拖拽
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="select-wrapper">  
  2.         <div class="div-group">  
  3.             <div class="width-53 clearfix">  
  4.                 <div class="form-content pink-border-color border-2px clearfix" data-bs="lead" id="leading">  
  5.                     <div class="form-left">  
  6.                         <div class="form-title pink-bg-color">部门负责人</div>  
  7.                     </div>  
  8.                     <div class="form-right">  
  9.                         <div class="score-wrapper clearfix">  
  10.                             <div class="score-f">  
  11.                                 <span class="score-span blue-bg"></span>  
  12.                                 100 :  
  13.                             </div>  
  14.                             <div class="top-droppable pink-border-color people-group clearfix">  
  15.   
  16.                             </div>  
  17.                             <div class="score-xz num-xz">  
  18.                                 <span class="numSpan">0</span>/<span class="totalNum">2</span>  
  19.                             </div>  
  20.                         </div>  
  21.                         <div class="score-wrapper">  
  22.                             <div class="score-f">  
  23.                                 <span class="score-span qi-bg"></span>  
  24.                                 95 :  
  25.                             </div>  
  26.                             <div class="top-droppable pink-border-color people-group clearfix">  
  27.   
  28.                             </div>  
  29.                             <div class="score-xz num-xz">  
  30.                                 <span class="numSpan">0</span>/<span class="totalNum">5</span>  
  31.                             </div>  
  32.                         </div>  
  33.                         <div class="score-wrapper clearfix">  
  34.                             <div class="score-f">  
  35.                                 <span class="score-span green-bg"></span>  
  36.                                 90 :  
  37.                             </div>  
  38.                             <div class="top-droppable pink-border-color people-group clearfix">  
  39.   
  40.                             </div>  
  41.                             <div class="score-xz">  
  42.                                 <span class="numSpan">0</span>/<span>不限</span>  
  43.                             </div>  
  44.                         </div>  
  45.                         <div class="score-wrapper">  
  46.                             <div class="score-f">  
  47.                                 <span class="score-span yellow-bg"></span>  
  48.                                 90以下 :  
  49.                             </div>  
  50.                             <div class="top-droppable pink-border-color people-group clearfix">  
  51.   
  52.                             </div>  
  53.                             <div class="score-xz">  
  54.                                 <span class="numSpan">0</span>/<span>不限</span>  
  55.                             </div>  
  56.                         </div>  
  57.                     </div>  
  58.                 </div>  
  59.             </div>  
  60.             <div class="width-47 clearfix">  
  61.                 <div class="people-list pink-border-color border-2px ">  
  62.                     <ul class="list-wrapper clearfix" id="leader-wrapper">  
  63.                     </ul>  
  64.                 </div>  
  65.   
  66.             </div>  
  67.         </div>  
  68.         <div class="div-group">  
  69.             <div class="width-53 clearfix">  
  70.                 <div class="form-content qblue-border-color border-2px clearfix" data-bs="own" id="owner">  
  71.                     <div class="form-left">  
  72.                         <div class="form-title qblue-bg-color">本部门人员</div>  
  73.                     </div>  
  74.                     <div class="form-right">  
  75.                         <div class="score-wrapper clearfix">  
  76.                             <div class="score-f">  
  77.                                 <span class="score-span blue-bg"></span>  
  78.                                 100 :  
  79.                             </div>  
  80.                             <div class="top-droppable pink-border-color people-group clearfix">  
  81.   
  82.                             </div>  
  83.                             <div class="score-xz num-xz">  
  84.                                 <span class="numSpan">0</span>/<span class="totalNum">2</span>  
  85.                             </div>  
  86.                         </div>  
  87.                         <div class="score-wrapper">  
  88.                             <div class="score-f">  
  89.                                 <span class="score-span qi-bg"></span>  
  90.                                 95 :  
  91.                             </div>  
  92.                             <div class="top-droppable pink-border-color people-group clearfix">  
  93.   
  94.                             </div>  
  95.                             <div class="score-xz num-xz">  
  96.                                 <span class="numSpan">0</span>/<span class="totalNum">5</span>  
  97.                             </div>  
  98.                         </div>  
  99.                         <div class="score-wrapper clearfix">  
  100.                             <div class="score-f">  
  101.                                 <span class="score-span green-bg"></span>  
  102.                                 90 :  
  103.                             </div>  
  104.                             <div class="top-droppable pink-border-color people-group clearfix">  
  105.   
  106.                             </div>  
  107.                             <div class="score-xz">  
  108.                                 <span class="numSpan">0</span>/<span>不限</span>  
  109.                             </div>  
  110.                         </div>  
  111.                         <div class="score-wrapper">  
  112.                             <div class="score-f">  
  113.                                 <span class="score-span yellow-bg"></span>  
  114.                                 90以下 :  
  115.                             </div>  
  116.                             <div class="top-droppable pink-border-color people-group clearfix">  
  117.   
  118.                             </div>  
  119.                             <div class="score-xz">  
  120.                                 <span class="numSpan">0</span>/<span>不限</span>  
  121.                             </div>  
  122.                         </div>  
  123.                     </div>  
  124.                 </div>  
  125.             </div>  
  126.             <div class="width-47 clearfix">  
  127.                 <div class="people-list qblue-border-color border-2px ">  
  128.                     <ul class="list-wrapper clearfix" id="owner-wrapper">  
  129.                     </ul>  
  130.                 </div>  
  131.   
  132.             </div>  
  133.         </div>  
  134.         <div class="div-group">  
  135.             <div class="width-53 clearfix">  
  136.                 <div class="form-content qyellow-border-color border-2px clearfix" data-bs="other" id="other">  
  137.                     <div class="form-left" style="margin-top: -70px">  
  138.                         <div class="form-title qyellow-bg-color">其他部门人员</div>  
  139.                     </div>  
  140.                     <div class="form-right">  
  141.                         <div class="score-wrapper clearfix">  
  142.                             <div class="score-f">  
  143.                                 <span class="score-span blue-bg"></span>  
  144.                                 100 :  
  145.                             </div>  
  146.                             <div class="top-droppable pink-border-color people-group clearfix">  
  147.   
  148.                             </div>  
  149.                             <div class="score-xz num-xz">  
  150.                                 <span class="numSpan">0</span>/<span class="totalNum">2</span>  
  151.                             </div>  
  152.                         </div>  
  153.                         <div class="score-wrapper">  
  154.                             <div class="score-f">  
  155.                                 <span class="score-span qi-bg"></span>  
  156.                                 95 :  
  157.                             </div>  
  158.                             <div class="top-droppable pink-border-color people-group clearfix">  
  159.   
  160.                             </div>  
  161.                             <div class="score-xz num-xz">  
  162.                                 <span class="numSpan">0</span>/<span class="totalNum">5</span>  
  163.                             </div>  
  164.                         </div>  
  165.                         <div class="score-wrapper clearfix">  
  166.                             <div class="score-f">  
  167.                                 <span class="score-span green-bg"></span>  
  168.                                 90 :  
  169.                             </div>  
  170.                             <div class="top-droppable pink-border-color people-group clearfix">  
  171.   
  172.                             </div>  
  173.                             <div class="score-xz">  
  174.                                 <span class="numSpan">0</span>/<span>不限</span>  
  175.                             </div>  
  176.                         </div>  
  177.                         <div class="score-wrapper">  
  178.                             <div class="score-f">  
  179.                                 <span class="score-span yellow-bg"></span>  
  180.                                 90以下 :  
  181.                             </div>  
  182.                             <div class="top-droppable pink-border-color people-group clearfix">  
  183.   
  184.                             </div>  
  185.                             <div class="score-xz">  
  186.                                 <span class="numSpan">0</span>/<span>不限</span>  
  187.                             </div>  
  188.                         </div>  
  189.                     </div>  
  190.                 </div>  
  191.             </div>  
  192.             <div class="width-47 clearfix">  
  193.                 <div class="people-list qyellow-border-color border-2px ">  
  194.                     <ul class="list-wrapper clearfix" id="other-wrapper">  
  195.                     </ul>  
  196.                 </div>  
  197.   
  198.             </div>  
  199.         </div>  
  200.     </div>  

 


原文地址:http://www.freejs.net/article_jquerywenzi_747.html