web-dev-qa-db-ja.com

jQuery UI sortable（）の軽量代替？

jQuery UI（1.8以降）は素晴らしいライブラリになりつつありますが、多くの場合、私にとってはあまりにも多くのことができます。フットプリントが小さいソート可能なリストを作成するための代替ライブラリはありますか？
プレースホルダやクロスリストソートなどの機能を除外することは許容されます。

編集：
（これは興味深い議論になりました、すべての返信に感謝します。）
ソート可能なjQuery UIが何であるかを知らないユーザーがいるようです。これはテーブルの並べ替えではなくテーブルの並べ替えです。 Netflixキューの並べ替えを検討してください。こちらのデモをご覧ください： http://jqueryui.com/demos/sortable/

javascriptjqueryjquery-uijquery-ui-sortable
33
tbeseda

私が見つけた最小かつ最も単純なコードは HTML5 Sortable でした。これは、幅広いブラウザーで機能する小さなJQueryプラグインであり、サイズはわずか1.5 KBです。

HTML5 sortableのデモはこちら 。

25
mikemaccana

この前に投稿された回答は驚くほど古くなっています。

Sortable は、HTML5のネイティブドラッグ＆ドロップAPIで動作するタッチサポート付きの高速で依存性のない、並べ替え可能な小さなリストウィジェットです。 Bootstrap、Foundation、または任意のCSSライブラリで使用でき、インスタンス化は1行で完了します。

リスト内またはリスト間の並べ替えをサポートしています。要素のみを受け取ることができるリスト、またはドラッグすることはできるがドロップすることはできないリストを定義できます。また、非常に積極的にメンテナンスされており、 GitHubでMITライセンス です。

new Sortable(document.getElementsByClassName('sortable')[0]);
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

<!-- Sortable -->
<script src="https://rawgit.com/RubaXa/Sortable/master/Sortable.js"></script>

<ul class="list-group sortable">
  <li class="list-group-item">This is <a href="http://rubaxa.github.io/Sortable/">Sortable</a></li>
  <li class="list-group-item">It works with Bootstrap...</li>
  <li class="list-group-item">...out of the box.</li>
  <li class="list-group-item">It has support for touch devices.</li>
  <li class="list-group-item">Just drag some elements around.</li>
</ul>
28
Artem Verbo

さて、私は他の誰かがより良い答えを得るのを待っていましたが、それはまだ起こっていないので、私は自分の研究を共有します：

この欠如について理論的に自由に考えれば、ドラッグアンドドロップには多くのクロスブラウザハックと修正が必要なので、これが当てはまると思います古いブラウザ、したがってその問題を経験する予定のある人は、少なくともpainの量を制限する既存のライブラリに依存します。

2
David Mulder

jQuery sortable at 8.4 Kb minifiedは別の候補です。これはjQueryプラグインであり、積極的にメンテナンスされているようです。

1
jogaco

Javascriptmvc.comフレームワークを試すことができます。それはjqueryの上に構築されており、強力な「スチール」メカニズムを備えているため、実際に使用しているフレームワークのその部分のみを含めることができます。

そのmxuiライブラリはソート可能な機能を提供します。ここで試すことができます： http://javascriptmvc.com/docs.html#!Mxui.Layout.Sortable

0
Samuel Hapak

あなたが言ったように-「jQuery UI（1.8+）は素晴らしいライブラリーになりつつあります」。そう思うなら、なぜ他のライブラリを選択するのか、jQuery uiライブラリはロードが非常に重いので、それに代わるものが欲しいと思います。はいの場合、 カスタムダウンロードを実行して、必要な機能のみを選択します。 カスタムライブラリをダウンロードしたら、サーバーにアップロードするか、次のような無料のJavaScriptホスティングWebサイトにアップロードします
http://yourjavascript.com/.
または this list。 からWebサイトを選択します

0
NewUser

SO回答はSamuel Hapakから提供されました。steal.jsファイルは18.7kbのヘビーウェイトです。次に、（steal "sortables.js at 2.7kbは、それを大幅に増やします21.4kb。4kbにオプションのドロップを追加し、5.5kbにドラッグすると、総計が30.9kbに移動します。デモページを参照 here とソースNETを表示開発ツールのタブ。

比較のために、jQuery UI Sortableプラグインは33.3Kbで重み付けします（必要のない必要な裸のUI Coreを含みます） ）。


Interface Element Sortables 軽量プラグインを考慮してください18.9Kbおよびwithdrag、drop、utilの3つの依存関係が含まれます。

インターフェイス要素Sortablesにも簡単なサンプルページ [〜＃〜] here [〜＃〜] と [〜＃〜]ここ[〜＃〜] 。

0
arttronics