我用於我的頁面的jQuery UI可排序項目不起作用？

我試着在頁面中放置可排序的項目作爲網格，但它顯示爲普通數字，請告訴我原因。我用於我的頁面的jQuery UI可排序項目不起作用？

<div class="demo"> 

<ul id="sortable"> 
<li class="ui-state-default">1</li> 
<li class="ui-state-default">2</li> 
<li class="ui-state-default">3</li> 
<li class="ui-state-default">4</li> 
<li class="ui-state-default">5</li> 
<li class="ui-state-default">6</li> 
<li class="ui-state-default">7</li> 
<li class="ui-state-default">8</li> 
<li class="ui-state-default">9</li> 
<li class="ui-state-default">10</li> 
<li class="ui-state-default">11</li> 
<li class="ui-state-default">12</li> 
</ul> 

</div>

，我的頭部粘貼腳本和風格標籤從jQuery的是這樣的：

<style> 
#sortable { list-style-type: none; margin: 0; padding: 0; } 
#sortable li { margin: 3px 3px 3px 0; padding: 1px; float: left; width: 100px;  height: 90px; font-size: 4em; text-align: center; } 
</style> 
<script> 
$(function() { 
    $("#sortable").sortable(); 
    $("#sortable").disableSelection(); 
}); 
</script>

來源

2012-08-30 Komeyl94

檢查您的控制檯，它會給你任何錯誤？你有沒有包含jQuery和jQuery UI？ – Asciiom

有沒有犯錯誤，我是的，我做了。那麼解決方案是什麼？ – Komeyl94

這按預期工作：http://jsfiddle.net/L2aAW/。你可能有一些缺失的樣式。 – rcdmk

看來你缺少的CSS文件。確保你已經包含了jquery-ui-x.x.x.css文件。排序功能工作正常，所以看起來呈現

的問題我添加從谷歌CDN的CSS和它看起來很好，現在

<link rel="Stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css" />

您可能還需要從你的CSS刪除float: left所以他們顯示爲列表

來源

2012-08-30 15:10:12 hsalama

我用於我的頁面的jQuery UI可排序項目不起作用？

回答

相關問題