javascript - 使用 JQuery 在鼠标悬停时获取动态填充的表格单元格的背景颜色

Question

我正在从事酒店监控元素。我有一个动态填充的表，其单元格代表一个房间及其状态。单元格的背景颜色是根据此状态内联设置的。我使用 Jquery 在鼠标悬停时放大每个单元格并成功完成。但是我悬停的单元格是透明的。有什么办法可以获得动态填充单元格的背景颜色。我使用“for”循环来迭代和填充表格并设置背景颜色。

          foreach ($member as $result) {                    
                    $room = $result->ID;

                    if($result->Status === "staff"){
                        $color = "#008000";                                
                    }elseif ($result->Status === "guest"){
                        $color = "#FF0000";
                    }else{
                         $color = "#0066FF";
                    }
<td style="background-color:<?php echo $color ?>">
 <div class="outer-box" style="background-color:<?php echo $color ?>">
   <div class="box">
    <a href="<?php echo base_url()?>roomdetails_controller/roomdetails_function/<?php echo $room;?>"<?php echo "<p>ROOM:".$result->ID."</p>"; ?></a>
     <br>
     <div class="image-box">
       <img src="<?php echo $DND_Image;?>" alt="DND" style="width:27px;height:27px;"/>
     </div>
     <div class="image-box">
       <img src="<?php echo $CMR_Image;?>" alt="laundry" style="width:27px;height:27px;"/>
     </div>
     <div class="image-box">
       <img src="<?php echo $IRD_Image;?>" alt="makeupmyroom" style="width:27px;height:27px;"/>
     </div>
    </div>
  </div>
</td>

我试过 $(this).attr('background-color');在 'box'div 上，但没有成功。任何帮助将不胜感激

Answer 1

像这样，

$('#yourTableId td').on('mouseover',function(){
   var bgColor =$(this).css("background-color");
})