首先DWZ富客户端框架(jQuery RIA framework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架。写这篇博文是因为在工作中遇到了,拖动table的排序的效果。而在DWZ本身框架中只能对div进行拖动。

要实现拖动效果最需要dwz.sortDrag.js。在dwz.sortDrag.js中原本配置的是

var_op={cursor:'move',//selector的鼠标手势sortBoxs:'div.sortDrag',//拖动排序项父容器replace:true,//2个sortBox之间拖动替换items:'>*',//拖动排序项选择器selector:'',//拖动排序项用于拖动的子元素的选择器,为空时等于itemzIndex:1000};

产生的效果图:

上面代码是实现div拖动效果的。要想实现table拖动效果,只要在你要拖动到页面上加上下面的js代码即可:

$(function(){varoptions={cursor:'move',//selector的鼠标手势sortBoxs:'tbody.sortDrag',//拖动排序项父容器replace:true,//2个sortBox之间拖动替换items:'>tr',//拖动排序项选择器selector:'td:first',//拖动排序项用于拖动的子元素的选择器,为空时等于itemzIndex:1000};debugger;$('tbody',navTab.getCurrentPanel()).sortDrag(options);});

只是将里面的参数变成table中的元素。但是这个在IE中用的没有在Chrome中兼容性强,table中实现的效果图就是