0
我已經在某個表上實施了數據表,其中某些行應具有與其他行不同的背景色,由CSS類標識。動態更改所有行的數據表背景顏色
我想改變行的背景顏色,只要指針懸停在它上面。爲此,我使用下面的代碼。
$(document).ready(function() {
oTable = $('#mytable').dataTable({
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"fnRowCallback": function() {
// Assigning colors to inactive rows
$('tr').each(function() {
if ($(this).hasClass('inactive')) {
$(this).css('background', '#fccfcf');
$(this).find('.sorting_1').each(function() {
$(this).css('background', '#fccfcf');
});
}
});
},
"aoColumns": /*3 column table*/
[{
"bSearchable": false,
"bSortable": false
},
null, null]
});
// Dynamically binding hover function to change color and pointer on mouse hover
oTable.$('tr').hover(function() {
previousBackground = $(this).css('background-color');
$(this).css('background-color', '#e2ebff');
$(this).find('.sorting_1').each(function() {
$(this).css('background', '#e2ebff');
});
$(this).css('cursor', 'pointer');
}, function() {
$(this).css('background-color', previousBackground);
$(this).find('.sorting_1').each(function() {
$(this).css('background', previousBackground);
});
});
});
第一次加載時,表格給出了所需的結果。但是,當我對任何列進行排序時,一切都會崩潰。某些欄正確顯示背景顏色,有些欄只顯示一部分。如何在不讓排序類影響它的情況下更改背景顏色?
在排序完成後,Datatable會應用一些自己的CSS。所以只使用CSS將不起作用。數據表完成後,我將不得不動態更改CSS。 – ishan