Question

我使用jquery插件数据表来显示我的数据，它运行正常，我使用ajax从php获取数据，但是当我想要在桌子周围移动时突出显示悬停的行时，我遇到了问题。它不起作用。但是当我在其他表中使用脚本时，它可以工作。我在Chrome控制台中暂停了一些代码，它工作正常，我感到困惑，我该如何解决这个问题。这里的脚本：

  <script type="text/javascript">
$( document ).ready(function() {
    $('#example').dataTable({
                     "bProcessing": true,
                     "sAjaxSource": "testConn2008.php",
                     "bAutoWidth": true,
                     "aoColumns": [
                            { mData: '\u533a\u57df' } ,
                            { mData: '\u6708\u4efd' },
                            { mData: '\u7535\u8111\u7f16\u53f7' },
                            { mData: '\u7528\u6237\u518c\u53f7' } ,
                            { mData: '\u6c34\u8868\u7c7b\u578b' }
                    ]
            });
});
</script>
  <script type="text/javascript">
     $(document).ready(function() {  
         $("#example tbody tr").mouseover(function() {  
                  $(this).addClass("over");  
             });  
         $("#example tbody tr").mouseout(function() {  
                  $(this).removeClass("over");  
             });   

    }); 
  </script>
  <style type="text/css">
  tr.over td{  
background: #D6E8F8;  
font-weight: bold;  
}  
  </style>

Answer 1

我想知道你为什么要使用jquery。简单的CSS就可以实现这个目标。

#example td:hover
{
  background: #D6E8F8;  
  font-weight: bold;  
}

在jquery插件数据表中突出显示悬停的行

1 个答案: