可排序不与基础工作

Question

直接从jqueryUI example，使用基金会4（只包括jquery的头）工作。有没有其他人有这个问题？我的列表不是可拖放排序的。

在身体头

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
    <style> 
    #sortable1, #sortable2, #sortable3 { margin: 0; padding: 0; float: left; margin-right: 10px; background: #eee; padding: 5px; width: 143px;} 
    #sortable1 li, #sortable2 li, #sortable3 li { margin: 5px; padding: 5px; font-size: 1.2em; width: 120px; } 
    </style> 
    <script> 
     $(function() { 
     $("ul").sortable({ 
      connectWith: "ul" 
      dropOnEmpty: false 
     }); 

     $("#sortable1, #sortable2, #sortable3").disableSelection(); 
     }); 
    </script> 

（使用Django ......对不起时髦的模板标签）

<div class="large-4 columns"> 
     <ul id="sortable1"> 
      <li>Nathan</li> 
      <li>Bob</li> 
      <li>Joe</li> 
     </ul> 
    </div> 
    <div class="large-4 columns"> 
     <ul id="sortable2"> 

     </ul> 
    </div> 
    <div class="large-4 columns"> 
     <ul id="sortable3"> 

     </ul> 
    </div> 
    <!-- <script src="{% static "js/vendor/jquery.js" %}"></script> --> 
    <script src="{% static "js/foundation.min.js" %}"></script> 
    <script> 
     $(document).foundation(); 
    </script> 

Answer 1

我包括一切的顺序是错误的。

的体应该是这样的......

<script src="{% static "js/vendor/jquery.js" %}"></script> 
<script src="{% static "js/foundation.min.js" %}"></script> 
<script> 
    $(document).foundation(); 
</script> 
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 

<script> 

     $("ul").sortable({ 
      connectWith: "ul" 
      dropOnEmpty: false 
     }); 


     $("#sortable1, #sortable2, #sortable3").disableSelection(); 

</script>