jQuery UIのsortableで、リストに区切りを入れる方法を教えてください。

Question

pekeq

14

13もっと見る

500pt

コンピュータウェブ制作

jQuery UIのsortableで、リストに区切りを入れる方法を教えてください。

たとえばリストに5人の名前が入っていて、うち3位までが入賞するような状況があったとして、

1. Aさん
2. Bさん
3. Cさん
---- ここまで入賞 ----
4. Dさん
5. Eさん

このように、3位と4位の間に区切りを入れたいのです。

回答の条件

1人5回まで

登録：2012/02/24 02:42:32
終了：2012/02/26 22:49:53

コメントはまだありません

[人力]うごめもらーが湧いてきたあいまいもこ 2012-02-24 21:52:09

http://q.hatena.ne.jp/1330053052 とか。 http://q.hatena.ne.jp/1330018948　とか。僕のところにも。なんなんでしょうね。挙句の果てには id:fhtdd うーん？よく分からないですけど… とりあえずポイント貰

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

リクエスト送信済

回答リクエストを送信したユーザーはいません

Cherenkov · Accepted Answer · 2012-02-24T04:01:01+09:00

文法を気にしない人向け。(ol直下にspan)

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>jQuery UI Sortable - Include / exclude items</title>
	<link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css">
	<script src="http://jqueryui.com/jquery-1.7.1.js"></script>
	<script src="http://jqueryui.com/ui/jquery.ui.core.js"></script>
	<script src="http://jqueryui.com/ui/jquery.ui.widget.js"></script>
	<script src="http://jqueryui.com/ui/jquery.ui.mouse.js"></script>
	<script src="http://jqueryui.com/ui/jquery.ui.sortable.js"></script>
	<link rel="stylesheet" href="../demos.css">
	<style>
    .separator { margin-left: -20px; }
	</style>
	<script>
	$(function() {
		$("#sortable").sortable({
			cancel: ".separator",
			update: function(event, ui) {
				$(this).find('.separator').insertAfter($('li:eq(2)', this))
			}
		});

		$("#sortable li, .separator").disableSelection();
	});
	</script>
</head>
<body>
<div class="demo">
<ol id="sortable">
	<li class="ui-state-default">Aさん</li>
	<li class="ui-state-default">Bさん</li>
	<li class="ui-state-default">Cさん</li>
	<span class="separator">---- ここまで入賞 ----</span>
	<li class="ui-state-default">Dさん</li>
	<li class="ui-state-default">Eさん</li>
</ol>
</div>
</body>
</html>

jQuery UIのsortableで、リストに区切りを入れる方法を教えてください。

ベストアンサー

Cherenkov15044932012/02/24 04:01:01

参考

コメント（0件)

この質問への反応（ブックマークコメント）

トラックバック