• jquery实现标签上移、下移、置顶


    eg:如在后台的标签列表中,实现上移、下移、置顶功能

    思路:

    1、先用到的克隆方法.clone(true):

         即把当前要移动的项先保存好,备于后用。

    2、找到当前标签所对应的相关元素及其相关方法:

        如:.prev()当前元素上面的标签

             .next()当前元素下面的标签

             .after()xxx之后添加方法

             .before()xxx之前添加方法

             .prepend添加方法

    3、实现

    具体代码如:

    var productsLabel = {
        //设置置顶
        setHot: function(t){
            var bar = 'showAndHide_box';
            var obj = $(t).parents('.'+bar).clone(true);
            $(t).parents('.'+bar).remove();
            $(".showAndHide_list_box").prepend(obj);
        },

        //设置上移
        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('亲,现在已是最上的哦,不能再上移了...');
            }
        },

        //设置下移
        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('亲,现在已是最下的哦,不能再下移了...');
            }
        }
    }

    源码下载:点击下载

  • 相关阅读:
    报表
    重构改善既有代码设计--重构手法02:Inline Method (内联函数)& 03: Inline Temp(内联临时变量)
    重构改善既有代码设计--重构手法01:Extract Method (提炼函数)
    httpclient 学习
    JAVA中反射机制六(java.lang.reflect包)
    JAVA中反射机制五(JavaBean的内省与BeanUtils库)
    JAVA中反射机制四
    JAVA中反射机制三
    JAVA中反射机制二
    JAVA中反射机制一
  • 原文地址:https://www.cnblogs.com/waitingbar/p/4453363.html
Copyright © 2020-2023  润新知