效果如上图:
当光标离开表格时从表记录要和选中行对应,
并且通过单击行改变从表,使用了js中的mouseout及mouseover事件,代码如下:
var index = 0; $('#tenantGrid tbody tr').bind('mouseover', function () { $('#tenantGrid tbody tr').each(function (i) { if (i % 2 == 0) { $(this).css('background-color', '#FFFFFF'); } else { $(this).css('background-color', '#F2F2F2'); } }); $(this).css('background-color', '#FBEC88'); $(this).css('cursor', 'pointer'); }).bind('mouseout', function () { if ($(this)[0].rowIndex % 2 == 0) { $(this).css('background-color', '#FFFFFF'); } else { $(this).css('background-color', '#F2F2F2'); } $('#tenantGrid tbody tr:eq(' + index + ')').css('background-color', '#FBEC88'); }).bind('click', function () { $('#AllocatorsDiv').load('/BasicInfo/HCAllocatorDetail?tenantID=' + $(this).find('td:first').find('input:hidden').val()); index = $(this)[0].rowIndex - 1; });