jquery - 使用 jQuery 将类添加到前一个元素

Question

我有滑块，我想获取上一个 div 并将 class="prev" 添加到此

<div class="mb-panel" >
    <div class="mb-inside">
        <div id="container_1" class="mymasonryclass masonry">Example 1</div>
    </div>
</div>
<div class="mb-panel current">
    <div class="mb-inside">
        <div id="container_2" class="mymasonryclass masonry current">Example 1</div>
    </div>
</div>

在这里，我想要一个像“mymasonryclass masonry prev”这样的类，用于前一个 div 并以动态方式。

我为此使用了jquery。

我试过下面的代码：

$('.mymasonryclass').each(function(index, value){
    var cname = $(this).attr('class');
    if(cname.indexOf('current') != -1)
    {
        var div= $(this).parent('div');
        var prev= $(div).prev();
        var output;
        var x = $('.mb-inside');
        $('.mb-inside').each(function(index,value){
            var t1 = $(this).find('div.current');
            if(t1.length > 0)
            {
                var output = $('.mb-inside')[index-1];
                if(index-1 > 0)
                    output.css('float', 'right');
            }
        });
    }
});

但它不起作用。

Answer 1

鉴于上述结构，这可能是您所追求的：

var $previousPanel = $('.mb-panel.current').prev(); // get previous panel
$previousPanel.addClass('prev'); // add class to panel
$previousPanel.find('.masonry').addClass('prev'); // add class to inner div too

这是一个例子。

Answer 2

你可以使用我的直播 [[1]: http://jsfiddle.net/liyakat/SB6N3/][1]

它仅适用于一个静态 div，您可以根据需要使其动态化

 $(document).ready(function() {

 $("#container_2").hover(
function () {    

   $(this).parents(".mb-panel").prev().find('div.mymasonryclass').addClass('prev');

  },
  function () {
    // $(this).removeClass("hover");
  }
); 

});

Answer 3

我已经尝试过下面的代码并且它有效

var a = $('.mb-panel.current').prev();
var b = a.find('.mymasonryclass.masonry');
if(b)
b.css('float', 'right');