我对无序列表 (ul) 使用 jquery draggble 函数，并面临在项目更改后获取项目顺序并设置页面加载顺序的问题。假设我们有以下代码:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js> </script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
$(document).ready(function(){
$(".block").sortable({
axis: 'y',
update: function(event, ui) {// order changed
var order = jQuery(this).sortable('toArray');
// send this order to index.php and store it in db
}
});
});
</script>
</head>
<body>
<ul class="block" type="none">
<li id = "one">1</li>
<li id = "two">2</li>
<li id = "three">3</li>
<li id = "four">4</li>
<li id = "five">5</li>
</ul>
</body>
第二个文件是
<html>
<head>
<script>
$('.secondblock').sortable({axis:'y'});
// get order from index.php and set it to .secondblock
</script>
</head>
<body>
<ul class="secondblock" type="none">
<li id = "one">1</li>
<li id = "two">2</li>
<li id = "three">3</li>
<li id = "four">4</li>
<li id = "five">5</li>
</ul>
</body>
</html>
有没有可能的解决方案？
最佳答案
如果你不想在我评论过的链接上使用那个解决方案，你可以使用这个，更更简单:
function reorder(orderArray, elementContainer)
{
$.each(orderArray, function(key, val){
elementContainer.append($("#"+val));
});
}
orderArray:一个包含所有 ID 的数组，按照您想要的顺序(正是 sortable( "toArray") 返回的)
elementContainer:是包含可排序项目的 jQuery 对象。
这里有一个工作示例:
http://jsfiddle.net/ecP5k/1/
关于javascript - 获取项目的顺序 jquery sortable 并为它们设置顺序，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11876532/