eg:如在后臺(tái)的標(biāo)簽列表中,實(shí)現(xiàn)上移、下移、置頂功能
主要實(shí)現(xiàn)思路是節(jié)點(diǎn)操作,比如說(shuō):上移,直接把點(diǎn)擊項(xiàng)移動(dòng)到前一個(gè)節(jié)點(diǎn),以此類推,當(dāng)然實(shí)際代碼實(shí)現(xiàn)還要加些判斷,如當(dāng)前點(diǎn)擊操作項(xiàng)是否已經(jīng)是置底或置底了,如果是則給點(diǎn)相應(yīng)提示,好讓操作者知道發(fā)生了什么事情。
思路:
1、先用到的克隆方法.clone(true):
即把當(dāng)前要移動(dòng)的項(xiàng)先保存好,備于后用。
2、找到當(dāng)前標(biāo)簽所對(duì)應(yīng)的相關(guān)元素及其相關(guān)方法:
如:.prev()當(dāng)前元素上面的標(biāo)簽
.next()當(dāng)前元素下面的標(biāo)簽
.after()xxx之后添加方法
.before()xxx之前添加方法
.prepend添加方法
3、實(shí)現(xiàn)
具體代碼如:
var productsLabel = { //設(shè)置置頂 setHot: function(t){ var bar = 'showAndHide_box'; var obj = $(t).parents('.'+bar).clone(true); $(t).parents('.'+bar).remove(); $(".showAndHide_list_box").prepend(obj); }, //設(shè)置上移 setUp: function(t){ var bar = 'showAndHide_box'; if($(t).parents('.'+ bar).prev('.'+bar).html() != undefined){ var obj = $(t).parents('.'+bar).clone(true); $(t).parents('.'+bar).prev().before(obj); $(t).parents('.'+bar).remove(); }else{ alert('親,現(xiàn)在已是最上的哦,不能再上移了...'); } }, //設(shè)置下移 setDown: function(t){ var bar = 'showAndHide_box'; if($(t).parents('.'+bar).next('.'+bar).html() != undefined){ var obj = $(t).parents('.'+bar).clone(true); $(t).parents('.'+bar).next().after(obj); $(t).parents('.'+bar).remove(); }else{ alert('親,現(xiàn)在已是最下的哦,不能再下移了...'); } } }以上就是本文給大家分享的全部?jī)?nèi)容了,希望大家能夠喜歡。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注