2009-08-08 86 views
0

下面是我为我的网站的拖放,可以节省位置到MySQL 这是一对夫妇岁,虽然我想我的jQuery更新到新版本的全部代码。迁移到jQuery的jQuery UI的

该代码使用旧版本的jQuery 1.0.2和interface.js

我相信使用拖放与jQuery的较新版本的下降需要使用jQuery UI插件?

可别人谁了解的JavaScript/jQuery的帮助我得到这个工作有一个新的版本,当我尝试使用它的jQuery的新版本,它不会工作

<script type="text/javascript" > 
var USER={"ID":"<?php echo $uid; ?>"}; 

var _x; 
var _y; 
var _pos; 
if(document.all){document.body.onload=b_onload;} 
else{document.body.setAttribute("onload","b_onload()");} 
function b_onload(){ 
    $('#columns td.portlet_td').each(function(i){ 
     $(this).children("br").remove(); 
    }); 
    $('#columns td.portlet_td').Sortable(
     { 
      accept: 'portlet', 
      helperclass: 'sort_placeholder', 
      activeclass : 'sortableactive', 
      opacity: 0.7, 
      tolerance: 'touch', 
      handle:'.drag-handler', 

      onStop:function(){ 

       var x = getPos(); 

       if(!$("#lgif").get(0)){ 
        $('<i'+'mg id="lgif" src="images/loading.gif" style="display:block;position:absolute;top:500px;left:50%;" />').appendTo('body'); 
       } 

       var __top = (document.body && document.body.scrollTop)?(document.body.scrollTop):((document.documentElement && document.documentElement.scrollTop)? document.documentElement.scrollTop: 0); 

       $("#lgif").css({top:__top+'px'}); 

       $("#lgif").show(); 
$.getJSON(
    '/processing/ajax/HOMEsaveposition.php', 
    { 
     uid:(USER.ID), 
     position:x 
    }, 
    function(json){ 
     $("#lgif").hide(); 
    } 
); 
      } 
     } 
    ); 



}; 

function getPos(){ 
    _pos=""; 
    $('#columns td.portlet_td').each(function(i){ 
     _x=i; 
     $(this).children(".portlet").each(function(j){ 
      _y=j; 
      var index = this.getAttribute("id").split('id')[1] - 100; 
      var pos=_x+":"+index; 
      _pos+=pos+"|"; 
     }); 
    }); 
    return _pos; 
} 
</script> 

回答

0

夫妇的改进(I”敢肯定这还不是全部,但应该可以帮助你开始)

我只想替换:与

if(document.all){document.body.onload=b_onload;} 
else{document.body.setAttribute("onload","b_onload()");} 
$('body').load(b_onload); 

下一页您b_onload内()方法,你可以更换:

$('#columns td.portlet_td').each(function(i){ 
    $(this).children("br").remove(); 
}); 

$('#columns td.portlet_td br').remove(); 

至于你可以使用​​的排序。很难告诉你应该如何使用它,但有很多例子,我相信你会发现那些接近你想要的行为的人可以很容易地适应你的应用程序。 jQuery UI有相当不错的文档。

0

教程NetTuts向您展示了如何使用jQuery UI构建可拖动的可排序接口。

你可以做一个,看看那里的不同之处在于比较。

看看here