用jquery的sortable做自界说网站模块
|
本日讲讲jquery组件里的sortable(排序)。照旧但愿各人多颁发下本身的进修履历，也可看成往后的一种财产。  引用的内容：[www.veryhuo.com]
<script type="text/javascript"> $(function() { $(".column").sortable({ connectWith: '.column' }); }); </script> html代码省略...详情请查察http://jqueryui.com/demos/sortable/portlets.html 引用的内容：[www.veryhuo.com]
$('.column').sortable('toArray');
这样也只能获得第一个class是column里的ID数组.用each()? I tried, but not work;也许你能做到，也请你汇报我吧！以是只能转走其他要领了。或者你会说，这还不简朴么，直接把整个网页的机关存起来不就OK了？哈哈，I also think so！通过iedeveloper调试器材发明，它们拖动之后发明白改变，变的不是样式，而是div的先后次序。假如我把整个内容生涯起来的话，好像也行得通，不外量就有点大了，也不适于动态的内容。怎么办呢，于是我就想着只存它们的ID次序不就O了吗?于是我又给它们每人一个ID了。 引用的内容：[www.veryhuo.com]
$.each($(".column"), function(m) {}
再找每个column下的portlet; Copy to Clipboard引用的内容：[www.veryhuo.com]
$.each($(".column"), function(m) { $.each($(this).children(".portlet"), function(d) { } 接着就是把它们按本身的方法存起来。 Copy to Clipboard引用的内容：[www.veryhuo.com]
function saveLayout(){ var list = ""; $.each($(".column"), function(m) { list += $(this).attr('id') + ":"; $.each($(this).children(".portlet"), function(d) { list += $(this).attr('id') + "@"; }) list += "|"; }) $.cookie("list", list)} 这里还用到了另一组件jquery.cookie 引用的内容：[www.veryhuo.com]
$(".column").sortable({ connectWith: '.column', stop: saveLayout }); stop是指拖拽竣事后触发的变乱. 引用的内容：[www.veryhuo.com]
var list = $.cookie("list"); //获取cookie里的list值 //alert(list) var arrColumn = list.split('|'); $.each(arrColumn, function(m, n) { var elemId = n.split(':')[0]; //容器ID var arrRow = n.split(':')[1] ? n.split(':')[1].split('@') : ""; //单个序列ID $.each(arrRow, function(m, n) { if (n) {//解除空值 $("#" + elemId).append($("#sb" + n).attr('id', n))//把序列填加进容器 } }); }) （编辑：河北网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
