安装属性 – attr 方法也用于安装/退换属性值。

负有的事件回调函数都有五个参数:event和ui,浏览器自有event对象,和经过包装的ui对象
ui.helper – 表示sortable成分的JQuery对象,平时是如今成分的克隆对象
ui.position – 表示相对当前目的,鼠标的坐标值对象{top,left} ui.offset –
表示绝对于近年来页面,鼠标的坐标值对象{top,left} ui.item –
表示最近拖拽的成分 ui.placeholder – 占位符 ui.sender –
当前拖拽成分的所属sortable对象(仅当成分是从另一个sortable对象传递过来时有用)
·参数 appendTo : String : ‘parent’ Defines where the helper that moves
with the mouse is being appended to during the drag (for example, to
resolve overlap/zIndex issues卡塔尔(英语:State of Qatar). 早先:$.sortable; 获取:var appendTo =
$.sortable; 设置:$.sortable(‘option’, ‘appendTo’, ‘body’卡塔尔(قطر‎; axis :
String : false 假使有设置,则成分仅能横向或纵向拖动。可选值:’x’, ‘y’
开端:$.sortable; 获取:var axis = $.sortable;
设置:$.sortable(‘option’, ‘axis’, ‘x’卡塔尔国; cancel : Selector :
‘:input,button’ 阻止排序动作在合作的因素上发生。 发轫:$.sortable;
获取:var cancel = $.sortable; 设置:$.sortable(‘option’, ‘cancel’,
‘button’卡塔尔(قطر‎; connectWith : Selector : false
允许sortable对象连接另一个sortable对象,可将item成分拖拽到另壹在那之中。
开头:$.sortable({ connectWith: ‘.otherlist’ }卡塔尔; 获取:var connectWith =
$.sortable(‘option’, ‘connectWith’卡塔尔(英语:State of Qatar); 设置:$.sortable(‘option’,
‘connectWith’, ‘.otherlist’卡塔尔(قطر‎; containment : Element, String, Selector :
false 约束排序动作必须要在叁个钦定的范围内发生。可选值:DOM对象, ‘parent’,
‘document’, ‘window’, 或jQuery对象 初叶:$.sortable({ containment:
‘parent’ }卡塔尔(قطر‎; 获取:var containment = $.sortable(‘option’,
‘containment’卡塔尔; 设置:$.sortable(‘option’, ‘containment’, ‘parent’卡塔尔;
cursor : String : ‘auto’ 定义在上马排序动作时,若是的样式。
开首:$.sortable({ cursor: ‘crosshair’ }卡塔尔(قطر‎; 获取:var cursor =
$.sortable; 设置:$.sortable(‘option’, ‘cursor’, ‘crosshair’卡塔尔(英语:State of Qatar); cursorAt
: Object : false 超过导活动时,鼠标定位在的有个别地点上。可选值:{ top,
left, right, bottom }. 最初:$.sortable; 获取:var cursorAt =
$.sortable; 设置:$.sortable(‘option’, ‘cursorAt’, ‘top’卡塔尔(قطر‎; delay :
Integer : 0
以阿秒为单位,设置延迟多长时间才激活排序动作。此参数可防止误点击。
初步:$.sortable; 获取:var delay = $.sortable;
设置:$.sortable(‘option’, ‘delay’, 500卡塔尔国; distance : Integer : 1
决定起码要在要素上边拖动多少像素后,才正式接触排序动作。
初阶:$.sortable; 获取:var distance = $.sortable;
设置:$.sortable(‘option’, ‘distance’, 30卡塔尔国; dropOnEmpty : Boolean : true
是还是不是同意拖拽到贰个空的sortable对象中。 起先:$.sortable({ dropOnEmpty:
false }卡塔尔(قطر‎; 获取:var dropOnEmpty = $.sortable(‘option’, ‘dropOnEmpty’卡塔尔(英语:State of Qatar);
设置:$.sortable(‘option’, ‘dropOnEmpty’, false卡塔尔(قطر‎; forceHelperSize :
Boolean : false If true, forces the helper to have a size.
开始:$.sortable({ forceHelperSize: true }卡塔尔(英语:State of Qatar); 获取:var forceHelperSize =
$.sortable(‘option’, ‘forceHelperSize’卡塔尔国; 设置:$.sortable(‘option’,
‘forceHelperSize’, true卡塔尔国; forcePlaceholderSize : Boolean : false If
true, forces the placeholder to have a size. 起首:$.sortable({
forcePlaceholderSize: true }卡塔尔国; 获取:var forcePlaceholderSize =
$.sortable(‘option’, ‘forcePlaceholderSize’卡塔尔(英语:State of Qatar); 设置:$.sortable(‘option’,
‘forcePlaceholderSize’, true卡塔尔国; grid : Array : false
将排序对象的item成分视为四个格子管理,每便活动都按一个格子大小活动,数组值:[x,y]
初始:$.sortable; 获取:var grid = $.sortable;
设置:$.sortable(‘option’, ‘grid’, [50, 20]卡塔尔(英语:State of Qatar); handle : Selector,
Element : false 限定排序的动作一定要在item成分中的某些成分在此从前。
初步:$.sortable; 获取:var handle = $.sortable;
设置:$.sortable(‘option’, ‘handle’, ‘h2’卡塔尔(قطر‎; helper : String, Function :
‘original’ 设置是或不是在拖拽成分时,突显二个救助的成分。可选值:’original’,
‘clone’ 初阶:$.sortable; 获取:var helper = $.sortable;
设置:$.sortable(‘option’, ‘helper’, ‘clone’卡塔尔(英语:State of Qatar); items : Selector : ‘>
*’ 钦赐在排序对象中,哪些要素是足以开展拖拽排序的。 初叶:$.sortable;
获取:var items = $.sortable; 设置:$.sortable(‘option’, ‘items’, ‘li’卡塔尔;
opacity : Float : false 定义当排序时,扶助成分展现的折射率。
起先:$.sortable; 获取:var opacity = $.sortable;
设置:$.sortable(‘option’, ‘opacity’, 0.6卡塔尔国; placeholderType:
StringDefault: false 设置当排序动作发生时,空白占位符的CSS样式。
开始:$.sortable({ placeholder: ‘ui-state-highlight’ }卡塔尔; 获取:var
placeholder = $.sortable(‘option’, ‘placeholder’卡塔尔(قطر‎;
设置:$.sortable(‘option’, ‘placeholder’, ‘ui-state-highlight’卡塔尔; revert
: Boolean : false
即使设置成true,则被拖拽的因素在回到新职责时,会有四个卡通效果。
早先:$.sortable; 获取:var revert = $.sortable;
设置:$.sortable(‘option’, ‘revert’, true卡塔尔(英语:State of Qatar); scroll : Boolean : true
假诺设置成true,则成分被拖动到页面边缘时,会活动滚动。 早先:$.sortable;
获取:var scroll = $.sortable; 设置:$.sortable(‘option’, ‘scroll’,
false卡塔尔; scrollSensitivity : Integer : 20
设置当成分移动至边缘多少像素时,便早先滚动页面。 最初:$.sortable({
scrollSensitivity: 40 }卡塔尔; 获取:var scrollSensitivity =
$.sortable(‘option’, ‘scrollSensitivity’卡塔尔国; 设置:$.sortable(‘option’,
‘scrollSensitivity’, 40卡塔尔(英语:State of Qatar); scrollSpeed : Integer : 20
设置页面滚动的进程。 起初:$.sortable; 获取:var scrollSpeed =
$.sortable(‘option’, ‘scrollSpeed’卡塔尔(قطر‎; 设置:$.sortable(‘option’,
‘scrollSpeed’, 40卡塔尔国; tolerance : String : ‘intersect’
设置当拖动成分超出此外成分多少时便对成分实行重复排序。可选值:’intersect’,
‘pointer’ intersect:起码重叠四分之二 pointer:鼠标指针重叠成分起初:$.sortable({ tolerance: ‘pointer’ }卡塔尔(英语:State of Qatar); 获取:var tolerance =
$.sortable(‘option’, ‘tolerance’卡塔尔; 设置:$.sortable(‘option’,
‘tolerance’, ‘pointer’卡塔尔; zIndex : Integer : 1000
设置在排序动作发生时,成分的z-index值。 开头:$.sortable; 获取:var
zIndex = $.sortable; 设置:$.sortable(‘option’, ‘zIndex’, 5卡塔尔国; ·事件
start 当排序动作最先时触发那件事件。 定义:$.sortable({ start: function;
绑定:$.bind(‘sortstart’, function; sort 当元素发生排序时触发那件事件。
定义:$.sortable({ sort: function; 绑定:$.bind(‘sort’, function; change
当元素发生排序且坐标已发出改动时触发此事件。 定义:$.sortable({ change:
function; 绑定:$.bind(‘sortchange’, function; beforeStop
当排序动作利落此前触发此事件。当时占位符成分和救助成分仍然有效。
定义:$.sortable({ beforeStop: function; 绑定:$.bind(‘sortbeforeStop’,
function; stop 当排序动作停止时触发那件事件。 定义:$.sortable({ stop:
function; 绑定:$.bind(‘sortstop’, function; update
当排序动作甘休时且成分坐标已经发生改变时触发那一件事件。 定义:$.sortable({
update: function; 绑定:$.bind(‘sortupdate’, function; receive
当一个已接二连三的sortable对象抽出到另三个sortable对象的要素后触发那件事件。
定义:$.sortable({ receive: function; 绑定:$.bind(‘sortreceive’,
function; over 当贰个因素拖拽移入另三个sortable对象后触发那件事件。
定义:$.sortable({ over: function; 绑定:$.bind(‘sortover’, function;
out
当三个成分拖拽移出sortable对象移出并跻身另多个sortable对象后触发那件事件。
定义:$.sortable({ out: function; 绑定:$.bind(‘sortout’, function;
activate
当八个有选用连接的sortable对象以前排序动作时,全体允许的sortable触发这一件事件。
定义:$.sortable({ activate: function; 绑定:$.bind(‘sortactivate’,
function; deactivate
当三个有利用连接的sortable对象甘休排序动作时,全部允许的sortable触发这事件。
定义:$.sortable({ deactivate: function; 绑定:$.bind(‘sortdeactivate’,
function; ·方法 destory 从要素中移除拖拽作用。 用法:.sortable disable
禁止使用成分的拖拽功效。 用法:.sortable enable 启用元素的拖拽功能。
用法:.sortable option 获取或安装元素的参数。 用法:.sortable( ‘option’
, optionName , [value] 卡塔尔国 serialize
获取或安装类别化后的各种item成分的id属性。 用法:.sortable( ‘serialize’
, [options] 卡塔尔(英语:State of Qatar) toArray 获取种类化后的种种item成分的id属性的数组。
用法:.sortable refresh 手动重新刷新当前sortable对象的item成分的排序。
用法:.sortable refreshPositions
手动重新刷新当前sortable对象的item成分的坐标,此办法可能会下滑品质。
用法:.sortable cancel 打消当前sortable对象中item成分的排序改动。
用法:.sortable 排序后保存有二种方式,一是cookie,二是数据库配置文件等。
下边是数据库的有些代码 原著: 复制代码
代码如下: $ { var show = $; var orderlist = $; var listleft = $(“div[id
= ‘column_left’]”); var listcenter = $(“div[id =
‘column_center’]”); var listright = $(“div[id = ‘column_right’]”卡塔尔国;
$.sortable({ opacity: 0.5,//拖动的发光度 revert: true, //缓冲效果
cursor: ‘move’, //拖动的时候鼠标准样板式 connectWith: “.column”,
//初叶用update 结果奉行一遍,浪费财富,古改成stop
//可是stop在要素没有改造地方的时候也会实行,
//用update别的js会有标题,^_^ stop: function(){ var new_order_left =
[]; //左栏布局 var new_order_center = [];//中栏布局 var
new_order_right = [];//右栏布局 listleft.children.each {
new_order_left.push; listcenter.children.each {
new_order_center.push; listright.children.each {
new_order_right.push; var newleftid = new_order_left.join; var
newcenterid = new_order_center.join; var newrightid =
new_order_right.join; $.ajax({ type: “post”, url: jsonUrl,
//服务端管理程序 data: { leftid: newleftid, centerid: newcenterid,
rightid:newrightid}, //id:新的排列对应的ID,order:原排列顺序 //
beforeSend: function(卡塔尔(قطر‎ { // show.html; // }, success: function;
show.html;

复制代码 代码如下: $.ready{ $.change{
$;//重置全数 $; $.append(“–请选拔–“卡塔尔国; }卡塔尔; //监听专利类型change事件 $.change{ var
ptype = $; var atype = $;//对象值 var pid = $; if
{//从缓存里得到值得话无需再和服务器交互作用$.post(“Main/PatentSubsidy/getSubsidy”,{askfor:atype,precinct:pid},function{//再次回到json对象
$;//清空#stype下拉框
for(var i=0;i”+json[i].value+””); }; ptype.data;
//以#ptype的值为key参预到缓存 },’json’卡塔尔; }else{ var json =
ptype.data;//取缓存 $; for(var i=0;i”+json[i].value+””); }; } }); });
根据#precinct和#ptype取得#stype action method 复制代码 代码如下: public void getSubsidy(卡塔尔{
String askfor=null,precinct=null; if(null!=getPara&&!””.equals{
askfor=getPara; if(null!=getPara&&!””.equals{ precinct=getPara; } }else{
renderJson(“[{\”id\”:\”\”,\”value\”:\”–请选择–\”}]”);//传空值,返回
} String sql = “select s.id, s.subsidy_type, p.name from
org_subsidy_flow s, tab_precinct p where s.enabled = ‘true’ and
p.status = ‘1’ and s.patent_type = ‘” + askfor + “‘ and s.precinct =
p.id”; if(null!=precinct&&!””.equals{ sql += ” and p.id = “+precinct; }
sql += ” order by p.id, s.id”; List sf =
Org_subsidy_flow.dao.find!=0){ StringBuffer buffer = new
StringBuffer(); for;i++){ buffer.append(“{\”id\” : \””+sf.get+”\” ,
\”value\” : \””+sf.get.getStr+” — “+sf.get+”\”},”); } if{
renderJson(“[“+buffer.substring.toString; } }else{
renderJson(“[{\”id\”:\”\”,\”value\”:\”–请选择–\”}]”); } }

上边的例证演示如何改动链接中 href 属性的值:

实例复制代码
代码如下:$.click{$.attr(“href”,”卡塔尔(英语:State of Qatar)方法也允许你同时安装七个属性。上面包车型地铁例子演示怎样同一时候安装 href 和 title
属性:

发表评论

电子邮件地址不会被公开。 必填项已用*标注