2013-12-10 3 views
0

У меня есть пара div, когда я нахожусь, я хочу добавить класс к зависающему div, но в то же время я хочу добавить еще один класс ко всем divs которые не колебались, вот мой код:jquery добавить класс в div, добавить еще один класс ко всем остальным

Я знаю, что это легко исправить, я с видом когда-нибудь (или действительно устал лол)

HTML:

<div class="event"></div> 
<div class="event"></div> 
<div class="event"></div> 
<div class="event"></div> 
<div class="event"></div> 
<div class="event"></div> 
<div class="event"></div> 

JQuery:

<script type="text/javascript"> 
$(document).ready(function() { 
$(".event").hover(
function() { 
    $(this).addClass("hovered"); 
}, function() { 
    $(this).removeClass("hovered"); 
} 
); 
}); 
</script> 

ответ

0

Я хочу, чтобы добавить класс к наведен DIV, но в то же время я хочу , чтобы добавить еще один класс для всех дивы, которые не колебались

Держите элементы в переменной, Таким образом, вы можете просто предназначаться все, но не this

var elems = $(".event"); 

elems.hover(
    function() { 
     $(this).addClass("hovered"); 
     elems.not(this).addClass('something_else') 
    }, function() { 
     $(this).removeClass("hovered"); 
     elems.not(this).removeClass('something_else') 
    } 
); 
0

Вот попробуйте это:

$('div').hover(function() { // on a hover on a div 
    $('div').attr('class', 'event'); // remove the class; keep the first one 
    $(this).attr('class', 'hovered event'); // update the class for the current 
} 

Это использует attr из API jQuery для обновления и замены значений атрибутов. Надеюсь, это поможет вам.

Попробуйте эту скрипку: http://jsfiddle.net/afzaal_ahmad_zeeshan/SVRcw/

0

Вы должны использовать .not() исключить текущий элемент из общей коллекции элементов.

Try,

<script type="text/javascript"> 
$(document).ready(function() { 

var xElements = $(".event"); 

$(".event").hover(
function() { 
    xElements.not($(this)).addClass('anotherClass'); 
    $(this).addClass("hovered"); 
}, function() { 
    xElements.removeClass("hovered"); 
    $(".event").not($(this)).removeClass('anotherClass'); 
} 
); 
}); 
</script> 
0

использование not() попробовать этот

$(document).ready(function() { 
    var $event=$('.event'); 
    $event.hover(function() { 
     $(this).addClass("hovered"); 
     $event.not(this).addClass("newClass"); 
    }, function() { 
     $event.not(this).removeClass("newClass"); 
    }); 
}); 
Смежные вопросы