JQuery实现表格隔行换色,鼠标移动变色,点击选择变色

 ContractedBlock.gifCode

ExpandedBlockStart.gif
<%@ Page Language="C#" AutoEventWireup="true" Codebehind="WebForm1.aspx.cs" Inherits="WebApplication14.WebForm1" %>

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    
<title>无标题页title>

    
<script language="javascript" type="text/javascript" src="jquery.js">script>

    
<script language="javascript" type="text/javascript">
        var color;
        $(document).ready(function()
ExpandedBlockStart.gifContractedBlock.gif        
{
        $(
"#GridView1 tr").attr("selected","0");
     
          $(
"#GridView1 tr:even").not(":first").css("background","red");
                $(
"#GridView1 tr:odd").css("background","yellow");
        
            $(
"#GridView1 tr").not(":first").click(function()
ExpandedSubBlockStart.gifContractedSubBlock.gif            
{
                $(
"#GridView1 tr:even").not(":first").css("background","red");
                $(
"#GridView1 tr:odd").css("background","yellow");
                
                var selected 
= $(this).attr("selected");
                
if(selected == 1)
ExpandedSubBlockStart.gifContractedSubBlock.gif                
{
                    $(
this).attr("selected","0");
                    color
=$(this).css("background");
                    
                }

                
else
ExpandedSubBlockStart.gifContractedSubBlock.gif                
{
                    $(
"#GridView1 tr").attr("selected","0");
                    $(
this).attr("selected","1");
                    $(
this).css("background","green");
                    color
=$(this).css("background");
                }

            }
).mouseover(function()
ExpandedSubBlockStart.gifContractedSubBlock.gif            
{
                color 
= $(this).css("background");
                $(
this).css("background","green");
            }
).mouseout(function()
ExpandedSubBlockStart.gifContractedSubBlock.gif            
{
                $(
this).css("background",color);
                 
            }
);
            
        }
);
    
script>

head>
<body>
    
<form id="form1" runat="server">
        
<div>
            
&nbsp;<asp:TextBox ID="TextBox1" runat="server">asp:TextBox>
            
<asp:Button ID="Button2" runat="server" Text="Button" />&nbsp;
            
<br />
            
<br />
            
<br />
            
<asp:Button ID="Button1" runat="server" Text="Button" /><asp:GridView ID="GridView1"
                runat
="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1" EmptyDataText="没有可显示的数据记录。">
                
<Columns>
                    
<asp:BoundField DataField="User_id" HeaderText="User_id" SortExpression="User_id" />
                    
<asp:BoundField DataField="User_name" HeaderText="User_name" SortExpression="User_name" />
                    
<asp:BoundField DataField="User_max_borrow" HeaderText="User_max_borrow" SortExpression="User_max_borrow" />
                
Columns>
            
asp:GridView>
            
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:QIConnectionString1 %>"
                ProviderName
="<%$ ConnectionStrings:QIConnectionString1.ProviderName %>" SelectCommand="SELECT [User_id], [User_name], [User_max_borrow] FROM [Book_user]">
            
asp:SqlDataSource>
        
div>
    
form>
body>
html>

转载于:https://www.cnblogs.com/qishichang/archive/2008/11/23/1339328.html

你可能感兴趣的:(JQuery实现表格隔行换色,鼠标移动变色,点击选择变色)