Question

我有3个盒子。在每个大盒子里面（红色）有一个小盒子（默认为黑色但悬停时为灰色）。

在悬停红色框时，小方框颜色应该改变（现在正在改变这样好）。
当您单击红色框时，黑框应该变为灰色（正在工作），同时当您将鼠标悬停在其他框上时，它应该与第1点相同（这也是有效的）。但问题从这里开始。当您单击红色框时，黑框会变为灰色，再次单击该红色框时，灰色框不会变为黑色。所以黑盒子应该在每次点击红色框时切换（黑色到灰色，然后是灰色到黑色）。
我不能使用任何css：悬停效果。

Jquery的

$('.libg').click(function () {
    $('this').find('.imagebg').removeClass("clicked").toggleClass('active');
    $(this).find('.imagebg').toggleClass("clicked");
}).hover(

function () {
    if (!$(this).find('.imagebg').hasClass("clicked")) $(this).find('.imagebg').addClass('active');
},

function () {
    if (!$(this).find('.imagebg').hasClass("clicked")) $(this).find('.imagebg').removeClass('active');
});

是否有任何关系（数据点击为true）。

这是jfiddle - http://jsfiddle.net/squidraj/PTZE9/5/

Answer 1

删除额外的＆＃39; ＆＃39;来自$('this')

使用

$(this).find('.imagebg').removeClass("clicked").toggleClass('active');

代替

$('this').find('.imagebg').removeClass("clicked").toggleClass('active');

Demo

Onclick切换以及悬停更改类而不使用css悬停

1 个答案: