jquery - 为什么在 dom 更改后忽略对类的更改？

Question

我有一个价格网格，它使用相对定位来移动一个字段，在一个框的下方:overflow: hidden;。在这个字段中，有包含价格的绝对定位框。悬停此框时，上方和左侧的匹配值将改变颜色。为了实现这一点，使用 jQuery 切换一个类。这最初有效。

然而，移动网格后，类更改不再影响网格上方的 block 。在 Chrome 控制台中，我可以看到正在添加的类，但未应用它的 css 样式。该元素的其他样式没有改变。

我 100% 确定没有其他样式规则影响该元素，它只是在 DOM 更改后停止响应类中的更改。

我能以某种方式“刷新”DOM 吗？

编辑:

我试图只获取相关代码:

首先添加单元格:

$("#price_dates_cells").append("<div id='"+weekday[theBeginDate.getDay()]+"-"+theBeginDate.getDate()+"-"+(theBeginDate.getMonth()-1)+"' class='datecell' style='left: "+( Math.floor( difference / ( 3600 * 24 * 1000) ) * ( cellwidth ) )+"px'>"+weekday[theBeginDate.getDay()]+"<br>"+theBeginDate.getDate()+" "+yearmonth[theBeginDate.getMonth()]+"</div>");

切换类:

var str_element = "#"+weekday[Bdate.getDay()]+"-"+Bdate.getDate()+"-"+(Bdate.getMonth()-1);
$(str_element).toggleClass("red");

以及似乎导致问题的运动:

$('#price_grid').animate({"top": (( ( horizontalMovement ) * cellheight)) }, 'fast', 'linear');

Class not Applied http://img708.imageshack.us/img708/6491/classnotapplied.png

Answer 1

CSS 始终将 priority 赋予 last 语句。所以，如果你想覆盖你的 .datecell div color 然后写 red class after 它这样写:

.datecell{
  background-color:grey;
}
.red{
 background-color:red
}

你的情况就是这样

但是

如果你不想 red 覆盖 .datecell 那么这样写:

.red{
     background-color:red
    }
.datecell{
      background-color:grey;
    }