操作gridview,選中行時改變背景色且checkbox被選中,隔行變色,全選變色
<style type="text/css">
.checked { background: #c0c0ff; }
.odd { background: #72FE95; }
.even { background: #B8E2EF; }
.current { background: #FFDD75; }
</style>
aspx頁面<asp:GridView ID="gvShow" runat="server" AutoGenerateColumns="False" HeaderStyle-BackColor="#93BEE2" BorderColor="#93BEE2" Width="364px" OnRowDataBound="gvShow_RowDataBound"> <Columns> <asp:TemplateField> <HeaderTemplate> <asp:CheckBox ID="CheckAll" runat="server" Text="全選" ToolTip="按一次全選,再按一次取消全選"/> </HeaderTemplate> <HeaderStyle Width="50px"/> <ItemTemplate> <asp:CheckBox runat="server" ID="ckbChose"/> </ItemTemplate> <ItemStyle Width="30px" CssClass="txt"/> </asp:TemplateField> <asp:TemplateField HeaderText="部門"> <ItemTemplate> <asp:Label runat="server" ID="lblDep" Text='<%# Eval("PE_DEPA")%>'></asp:Label> </ItemTemplate> <ItemStyle Width="100px" CssClass="txt" /> </asp:TemplateField> <asp:TemplateField HeaderText="人員工號"> <ItemTemplate> <asp:Label runat="server" ID="lblCode" Text='<%# Eval("PE_ID") %>'></asp:Label> </ItemTemplate> <ItemStyle Width="120px" CssClass="txt"/> </asp:TemplateField> <asp:TemplateField HeaderText="人員名稱"> <ItemTemplate> <asp:Label runat="server" ID="lblName" Text='<%# Eval("PE_NAME") %>' Width="100px"></asp:Label> </ItemTemplate> <ItemStyle CssClass="txt"/> </asp:TemplateField> </Columns> <EmptyDataTemplate> <table align="center" cellpadding="0" cellspacing="1" width="364px" > <tr style="background-color:#93BEE2"> <td style= "height:25px; width:30px;" ><b>選擇</b></td> <td style=" height:25px;"><b>部門</b></td> <td style=" height:25px; width:120px;" ><b>人員工號</b></td> <td style=" height:25px;" ><b>人員名稱</b></td> </tr> <tr> <td colspan ="7" align ="center" style=" height:25px;" ><asp:Label runat="server" ID="lblEmptyData" ForeColor="red" Text="暫且沒有記錄資訊!" ></asp:Label></td> </tr> </table> </EmptyDataTemplate> <HeaderStyle BackColor="#93BEE2"></HeaderStyle> </asp:GridView>
js:
<script type="text/javascript"> var table = "<%=gvShow.ClientID %>"; var oldBg; function SelectAll(ele) { t = document.getElementById(table); for (i = 1; i < t.rows.length; i++) { t.rows[i].cells[0].children[0].checked = ele.checked; if (t.rows[i].cells[0].children[0].checked) { t.rows[i].className = "checked"; } else { t.rows[i].className = t.rows[i].getAttribute("oldClass"); } } } function CheckTr(tr, evt) { ele = evt.target || event.srcElement; if (ele.tagName && ele.tagName != "INPUT") tr.cells[0].children[0].checked = !tr.cells[0].children[0].checked; if (tr.cells[0].children[0].checked) { oldBg = tr.className = "checked"; } else { oldBg = tr.className = tr.getAttribute("oldClass"); } } </script>
後臺:
//滑鼠移動事件加單擊事件 protected void gvShow_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.Header) { CheckBox h = e.Row.FindControl("CheckAll") as CheckBox; h.Attributes.Add("onclick", "SelectAll(this)"); } else if (e.Row.RowType == DataControlRowType.DataRow) { e.Row.Attributes.Add("onclick", "CheckTr(this,event)"); //e.Row.Attributes.Add("class", e.Row.RowIndex % 2 == 0 ? "odd" : "even"); //e.Row.Attributes.Add("oldClass", e.Row.RowIndex % 2 == 0 ? "odd" : "even"); e.Row.Attributes.Add("onmouseover", "oldBg=this.className;this.className='current'"); e.Row.Attributes.Add("onmouseout", "this.className=oldBg;"); e.Row.Attributes["style"] = "Cursor:hand"; } }
相關推薦
操作gridview,選中行時改變背景色且checkbox被選中,隔行變色,全選變色
css:<style type="text/css"> .checked { background: #c0c0ff; } .odd { background: #72FE95; } .even { background: #B8E2E
eazyUI 修改datagrid選中行默認背景色
cte clas 背景 div pre color 默認 sel datagrid <style> .datagrid-row-selected { background: #D1EEEE; co
js隔行換色+全選/全部選demo
cell blue scale itl val let text demo 測試數據 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf
關於實現點選表格一行中任意一行即選中該行相關複選框,同時改變背景色的問題
js程式碼 /* * 點選tr即可勾選當前行復選框 * zhouxy * */ function checkTr(tr) { var tds = tr.childNodes; for(var j = 0; j < tds.length; j++) {
JTable中新增元件後,改變當選中時的背景色
在JTable中新增元件後,當我們選中某一行時,我們會發現其他欄的背景色會變為table設定的選中背景色,而帶有元件的那一欄背景色卻不變 這時,我們需要在TableCellRenderer中新增一個填充方法 下面以JLable元件為例: import java.awt.C
使用openpyxl的styles,實現寫入值時加背景色
背景顏色 文件名 excel 列表 data append 考試 app ubd 所用文件、數據和上一節代碼中用的一致 本次直接貼代碼 from openpyxl.styles import fillsfrom openpyxl import load_workbookcl
選中多選框時改變相對應的包裹複選框的元素樣式
首先 有這樣的一個效果: 即選中複選框的時候,相對應的li將改變背景色等樣式,完整的實現效果主要程式碼如下 原始html檔案 <div class="check"> <h5>症狀(可多選)</h5>
LigerUI 設定選中行顏色改變與設定水平滾動條不顯示
.l-grid-body { position: relative; width:100%; top: 0px; left: 0px; overflow: none;
iOS 按鈕點選改變背景色
- (void)viewDidLoad { [superviewDidLoad]; // Do any additional setup after loading the view. UIButton *btn = [[UIButtonalloc] i
Android 按壓狀態改變背景色
stat oid select col cto drawable XML min mine Android 按壓狀態改變背景色 <selector xmlns:android="http://schemas.android.com/apk/res/android"&g
SecureCR 改變背景色和文字顏色
global ESS img bold linu 文件 info 快捷 就是 1.打開SecureCR鏈接Linux服務器,Options->Session Options->Emulation->Terminal 選擇Linux (相應的服務器系統)AN
分享一個算法,計算能在任何背景色上清晰顯示的前景色
gray marker link media cef edit ref 相關 spa 原文:分享一個算法,計算能在任何背景色上清晰顯示的前景色 版權聲明:本作品采用知識共享署名-非商業性使用-相同方式共享 4.0 國際許可協議進行許可。歡迎轉
####全選【attr(“checked”,true)】;全不選【必須用removeAttr(“checked”),不能用attr("checked",false)》這傢伙或有“第二次全選失敗”問題】
####全選【attr(“checked”,true)】;全不選【必須用removeAttr(“checked”),不能用attr("checked",false)》這傢伙或有“第二次全選失敗”問題】 ====》用的jquery。 ====》第二次全選失敗”問題,找到這個:https://blo
computed 計算屬性改變背景色
html: <template> <div> <button @click="changeColor =! changeColor">cha
個人js學習例項-點選按鈕實現按鈕背景色變化以及相對應的div變化
效果: 程式碼: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title>
C#的winform中MDI 父窗體改變背景色
MdiClient ctlMDI; // Loop through all of the form's controls looking // for the control of type MdiClient. foreach (Control ctl in this.Controls) { tr
菜鳥學android——webview改變背景色出現閃屏
將webview設定為背景透明後出現閃屏: webview.setbackground(Color.TRANSPARENT); 關閉硬體加速就可以解決問題了: webview.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);
imagecreatetruecolor()與imagecreate()生成影象時的背景色
resource imagecreatetruecolor ( int $x_size , int $y_size ) 返回一個影象識別符號,代表了一幅大小為 x_size 和 y_size 的黑色影象。 resource imagecreate ( int $x
用Bootstrap建立表格,並初始化一行背景色
初始化載入資料,並預設新增一行背景色 程式碼如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title>
[Android]ListView滾動時itemview背景色變成黑色的解決方式
在使用listView的過程中,偶然也會遇到一些小問題,比如在listview中除錯背景色的過程中會遇到這樣或那樣的問題.比如我指定某行高亮之後, 然後就讓我遇到了一個比較經典的issue,在拖動的