jquery realizes tag up down and top

  • 2020-06-01 08:20:44
  • OfStack

eg: such as in the background of the label list, to achieve the move up, move down, top function

The main implementation idea is the node operation, such as: move up, directly move the click item to the previous 1 node, and so on, of course, the actual code implementation but also add some judgment, such as the current click operation item is already set or set the bottom, if it is to give a corresponding hint, so that the operator know what happened.

Ideas:

1. The cloning method used first.

That is, the current item to be moved to save first, for later use.

2. Find the relevant elements corresponding to the current label and relevant methods:

For example:.prev () the tag above the current element

.next () tag below the current element

.after ()xxx add method after xxx

.before ()xxx before adding a method

.prepend add method

3, implementation,

The specific code is as follows:


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

  // Set up  
  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(' Dear, now it is the top oh, can't move up any more ...'); 
    } 
  },

  // Set down  
  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(' Dear, now is the bottom of the oh, can not be moved down ...'); 
    } 
  } 
}

That's all I want to share with you. I hope you like it.


Related articles: