关闭

在ASP.NET中实现鼠标移动悬停在DataGrid时高亮显示这一行的方法

380人阅读 评论(0) 收藏 举报
 

HTML Tags and JavaScript tutorial



在ASP.NET中实现鼠标移动悬停在DataGrid时高亮显示这一行的方法




首先在WebFrom页面中添加JavaScript 代码块
//鼠标移动时高亮显示所悬停的行function SetDataGridBackColor(color,isMouseOut){var tr=event.srcElement.parentElement;var iRowIndex = tr.rowIndex ;if( isMouseOut ){if( ( iRowIndex % 2 ) == 1 ){tr.style.backgroundColor = color;}else{tr.style.backgroundColor = "#EAE9D7";}}else{tr.style.backgroundColor = color;}}
//鼠标移动时高亮显示所悬停的行function SetDataGridBackColor(color,isMouseOut){var tr=event.srcElement.parentElement;var iRowIndex = tr.rowIndex ;if( isMouseOut ){if( ( iRowIndex % 2 ) == 1 ){tr.style.backgroundColor = color;}else{tr.style.backgroundColor = "#EAE9D7";}}else{tr.style.backgroundColor = color;}}
 1
<
script
>
 2
        
//
鼠标移动时高亮显示所悬停的行
 3
        
function
 SetDataGridBackColor(color,isMouseOut)
 4
        
{
 5
            
var
 tr
=
event.srcElement.parentElement;
 6
            
 7
            
var
 iRowIndex 
=
 tr.rowIndex ;
 8
            
if
( isMouseOut )
 9
            
{
10
                
if
( ( iRowIndex 
%
 
2
 ) 
==
 
1
 )
11
                
{
12
                    tr.style.backgroundColor 
=
 color;
13
                }
14
                
else
15
                
{
16
                    tr.style.backgroundColor 
=
 
"
#EAE9D7
"
;
17
                }
18
            }
19
            
else
20
            
{
21
                tr.style.backgroundColor 
=
 color;
22
            }
23
        }
24
        
</
script
>
//鼠标移动时高亮显示所悬停的行function SetDataGridBackColor(color,isMouseOut){var tr=event.srcElement.parentElement;var iRowIndex = tr.rowIndex ;if( isMouseOut ){if( ( iRowIndex % 2 ) == 1 ){tr.style.backgroundColor = color;}else{tr.style.backgroundColor = "#EAE9D7";}}else{tr.style.backgroundColor = color;}}
//鼠标移动时高亮显示所悬停的行function SetDataGridBackColor(color,isMouseOut){var tr=event.srcElement.parentElement;var iRowIndex = tr.rowIndex ;if( isMouseOut ){if( ( iRowIndex % 2 ) == 1 ){tr.style.backgroundColor = color;}else{tr.style.backgroundColor = "#EAE9D7";}}else{tr.style.backgroundColor = color;}}
//鼠标移动时高亮显示所悬停的行function SetDataGridBackColor(color,isMouseOut){var tr=event.srcElement.parentElement;var iRowIndex = tr.rowIndex ;if( isMouseOut ){if( ( iRowIndex % 2 ) == 1 ){tr.style.backgroundColor = color;}else{tr.style.backgroundColor = "#EAE9D7";}}else{tr.style.backgroundColor = color;}}
//鼠标移动时高亮显示所悬停的行function SetDataGridBackColor(color,isMouseOut){var tr=event.srcElement.parentElement;var iRowIndex = tr.rowIndex ;if( isMouseOut ){if( ( iRowIndex % 2 ) == 1 ){tr.style.backgroundColor = color;}else{tr.style.backgroundColor = "#EAE9D7";}}else{tr.style.backgroundColor = color;}}
然后在aspx文件中的DataGrid事件中去注册这个脚本
    
private
 
void
 dgTemp_PreRender(
object
 sender, System.EventArgs e)
        
{
            
for
 (
int
 i 
=
 
0
 ; i 
<
 dgTemp.Items.Count; i
++
)
            
{
                dgTemp.Items[i].Attributes.Add(
"
onmouseover
"
,
"
SetDataGridBackColor('LightBlue',false);
"
);
                dgTemp.Items[i].Attributes.Add(
"
onmouseout
"
,
"
SetDataGridBackColor('white',true);
"
);
            }
        }
为了防止DataGrid标头的滚动,可以在增加这么一个脚本
        
private
 
void
 dgTemp_ItemCreated(
object
 sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
        
{
            
//
使DataGrid标头不滚动
            
if
 (e.Item.ItemType 
==
 ListItemType.Header)
            
{
                e.Item.Style.Add(
"
position
"
,
"
relative;top:expression(document.all['dgBHGJBSZ'].offsetParent.scrollTop);
"
);
            }
        }
链接地址:
http://Arthur1999.cnblogs.com/archive/2006/07/14/450487.html
 


0
0

猜你在找
【套餐】Hadoop生态系统零基础入门
【套餐】嵌入式Linux C编程基础
【套餐】2017软考系统集成项目——任铄
【套餐】Android 5.x顶级视频课程——李宁
【套餐】深度学习入门视频课程——唐宇迪
【直播】广义线性模型及其应用——李科
【直播】从0到1 区块链的概念到实践
【直播】计算机视觉原理及实战——屈教授
【直播】机器学习之凸优化——马博士
【直播】机器学习&数据挖掘7周实训--韦玮
查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:150454次
    • 积分:4028
    • 等级:
    • 排名:第7666名
    • 原创:242篇
    • 转载:0篇
    • 译文:0篇
    • 评论:16条
    文章存档
    最新评论