使用 jquery 使完整的 dt dd 可拖动

Question

我有一个 jsfiddle，我想让完整的 dt 内容可拖动。

我该怎么做，谁能帮我解决这个问题。

 <dl id="sortable1">
<dt class="ui-state-default">Title</dt>
<dd>Hello</dd>
<dt class="ui-state-default">Title</dt>
<dd>Hello</dd>
<dt class="ui-state-default">Title</dt>
<dd>Hello</dd>
<dt class="ui-state-default">Title</dt>
<dd>Hello</dd>
<dt class="ui-state-default">Title</dt>
<dd>Hello</dd>
<dt class="ui-state-default">Title</dt>
<dd>Hello</dd>
<dt class="ui-state-default">Title</dt>
<dd>Hello</dd>

</dl>

JS代码

     $( function() {
    $( "#sortable" ).sortable();

  } );

Answer 1

如果我理解正确的话，你希望能够将 "Title" 和 "Hello" 作为一个项目拖动吗？

如果是这样，只需将每个项目包装在 div:

  <div>
    <dt class="ui-state-default">Title</dt>
    <dd>Hello</dd>
  </div>

Fiddle: http://jsfiddle.net/5p2ynsLx/2/

使用 jquery 使完整的 dt dd 可拖动

Make full dt dd draggable using jquery

jquery

draggable

jquery-ui-draggable