JSDM

HTML

 
1
 <script src="https://cdnjs.cloudflare.com/ajax/libs/Sortable/1.8.3/Sortable.min.js"></script>
2
<div id="nestedDemo" class="list-group col nested-sortable">
3
  <div class="list-group-item nested-1">Item 1.1
4
    <div class="list-group nested-sortable">
5
      <div class="list-group-item nested-2">Item 2.1</div>
6
      <div class="list-group-item nested-2">Item 2.2
7
        <div class="list-group nested-sortable">
8
          <div class="list-group-item nested-3">Item 3.1</div>
9
          <div class="list-group-item nested-3">Item 3.2</div>
10
          <div class="list-group-item nested-3">Item 3.3</div>
11
          <div class="list-group-item nested-3">Item 3.4</div>
12
          <div class="list-group nested-sortable">
13
      <div class="list-group-item nested-2">Item 2.1</div>
14
      <div class="list-group-item nested-2">Item 2.2
15
        <div class="list-group nested-sortable">
16
          <div class="list-group-item nested-3">Item 3.1</div>
17
          <div class="list-group-item nested-3">Item 3.2</div>
18
          <div class="list-group-item nested-3">Item 3.3</div>
19
          <div class="list-group-item nested-3">Item 3.4</div>
20
          <div class="list-group nested-sortable">
21
      <div class="list-group-item nested-2">Item 2.1</div>
22
      <div class="list-group-item nested-2">Item 2.2
23
        <div class="list-group nested-sortable">
24
          <div class="list-group-item nested-3">Item 3.1</div>
25
          <div class="list-group-item nested-3">Item 3.2</div>
26
          <div class="list-group-item nested-3">Item 3.3</div>
27
          <div class="list-group-item nested-3">Item 3.4</div>
28
        </div>
29
      </div>
30
      <div class="list-group-item nested-2">Item 2.3</div>
31
      <div class="list-group-item nested-2">Item 2.4</div>
32
    </div>
33
        </div>
34
      </div>
35
      <div class="list-group-item nested-2">Item 2.3</div>
36
      <div class="list-group-item nested-2">Item 2.4</div>
37
    </div>
38
        </div>
39
      </div>
40
      <div class="list-group-item nested-2">Item 2.3</div>
41
      <div class="list-group-item nested-2">Item 2.4</div>
42
    </div>
43
  </div>
44
  <div class="list-group-item nested-1">Item 1.2</div>
45
  <div class="list-group-item nested-1">Item 1.3</div>
46
  <div class="list-group-item nested-1">Item 1.4
47
    <div class="list-group nested-sortable">
48
      <div class="list-group-item nested-2">Item 2.1</div>
49
      <div class="list-group-item nested-2">Item 2.2</div>
50
      <div class="list-group-item nested-2">Item 2.3</div>
51
      <div class="list-group-item nested-2">Item 2.4</div>
52
    </div>
53
  </div>
54
  <div class="list-group-item nested-1">Item 1.5</div>
55
</div>

CSS

x
 
1
#nestedDemo div, .nested-1, .nested-2, .nested-3 {
2
  margin-top: 5px;
3
}
4
5
.nested-1 {
6
  background-color: #e6e6e6;
7
}
8
9
.nested-2 {
10
  background-color: #cccccc;
11
}
12
13
.nested-3 {
14
  background-color: #b3b3b3;
15
}
16
.list-group-item{
17
  padding:10px 20px;
18
}
? ?
? ?
必须是有效的URL
+ 添加另一个资源

JS

xxxxxxxxxx
8
 
1
var nestedSortables = [].slice.call(document.querySelectorAll('.nested-sortable'));
2
3
for (var i = 0; i < nestedSortables.length; i++) {
4
  new Sortable(nestedSortables[i], {
5
    group: 'nested',
6
    animation: 150
7
  });
8
}
必须是有效的URL
+ 添加另一个资源
Close

文件管理 点击文件查看URL

图片

  1. 暂无文件

CSS

  1. 暂无文件

JavaScript

  1. 暂无文件

其他

  1. 暂无文件
拖动文件到上面的区域或者:
加载中 ..................