点击鼠标移动屏幕项目的顺序

Question

在我的屏幕上，我有一个简单的项目列表：

1. 第1项
2. 第2项
3. 第3项

我已经看过用户可以点击某个项目并使用鼠标在列表中更改其位置的示例。

问题是，这是怎么做到的？这是各种各样的javascript函数吗？

Answer 1

您可以使用jQuery Ui library轻松完成此操作。请关注此代码段

＆＃13;

＆＃13;

  #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
  #sortable li { background:#aeaeae; margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
  #sortable li span { position: absolute; margin-left: -1.3em; }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
 

  <script>
  $(function() {
    $( "#sortable" ).sortable();
    $( "#sortable" ).disableSelection();
  });
  </script>

 
<ul id="sortable">
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
   <li>Item 4</li>
   <li>Item 5</li>
   <li>Item 6</li>
</ul>

＆＃13;

＆＃13;

＆＃13;

Answer 2

点击鼠标移动屏幕项目的顺序

试试这个：jqueryui sortable

希望有所帮助