louisXIV1988 2016-01-06 08:28 采纳率: 20%
浏览 1474
已采纳

jQueryUI sortable,有一些疑惑希望的到大伙的帮助!

这两天在学习jQueryUI sortable,有一些疑惑希望的到大伙的帮助!

一下是代码:

 <!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>无标题文档</title>
</head>

<body>
<script src = 'http://code.jquery.com/jquery-1.8.3.js'></script>
<script src = 'http://code.jquery.com/ui/1.9.2/jquery-ui.js'></script>
<link rel=stylesheet type=text/css
      href='http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css' />
<style type=text/css>
  p.ui-sortable-helper {
    color : red;
  }
  #div3{border:5px solid red;  float:right;}
  #div2{float:left;}
  .column{width:100px; height:200px;}
</style>
<div id="container">
<div id=div1 class="column">
  <p> Paragraph 1 </p>
  <p> Paragraph 2 </p>
  <p> Paragraph 3 </p>
  <p> Paragraph 4 </p>
  <p> Paragraph 5 </p>
  </div>

<div id=div2 class="column">
  <p> Paragraph 11 </p>
  <p> Paragraph 12 </p>
  <p> Paragraph 13 </p>
  <p> Paragraph 14 </p>
  <p> Paragraph 15 </p>
</div>
<div id=div3 class="column">
  <p> Paragraph a </p>
  <p> Paragraph b </p>
  <p> Paragraph c </p>
  <p> Paragraph 14 </p>
  <p> Paragraph 15 </p>
</div>

</div>

<script>
//1.
// $("#div1").sortable ({
//  revert : 1000,
//  connectWith : "#div2,#div3",//div1的元素可以放入div2和div3中;  
//});
//$("#div2").sortable ({
//  revert : 1000,
//  connectWith : "#div1"//div2的元素可以放入div1中;
//});
//$("#div3").sortable ({
//  revert : 1000,//div3只能接受别人放进来的元素,不能将自己的元素放入别人那里;
  //connectWith : "#div1"
//});

//2.
$('#container').sortable({
  items:'p',
  connectWith:'.column'
});

//3. dropOnEmpty default true
//$('.column').sortable({
//  items:'p',
//  connectWith:'.column'
//  //dropOnEmpty:false
//});
</script>
</body>
</html>

迷惑之处:
1.以上3种写法具体有什么区别?
2.第2种dropOnEmpty无效
3.哪种才是合理的写法?
希望得到大伙的帮助,谢谢

  • 写回答

3条回答 默认 最新

  • Go 旅城通票 2016-01-07 02:52
    关注

    就选择器不一样而已,就是要操作的元素不一样,只要符合jq的选择器语法就行

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 关于#java#的问题,请各位专家解答!
  • ¥15 急matlab编程仿真二阶震荡系统
  • ¥20 TEC-9的数据通路实验
  • ¥15 ue5 .3之前好好的现在只要是激活关卡就会崩溃
  • ¥50 MATLAB实现圆柱体容器内球形颗粒堆积
  • ¥15 python如何将动态的多个子列表,拼接后进行集合的交集
  • ¥20 vitis-ai量化基于pytorch框架下的yolov5模型
  • ¥15 如何实现H5在QQ平台上的二次分享卡片效果?
  • ¥30 求解达问题(有红包)
  • ¥15 请解包一个pak文件