asp.net 滑鼠移入Repeater某一行時改變顏色並且checkbox列被選中

暖楓無敵發表於2011-09-17
   <script language="javascript" type="text/javascript">
        
         /*被選中*/
        function OnCheck(event) {
            var obj = event.srcElement ? event.srcElement : event.target;
            if (obj.type == "checkbox") {
                clearSelectedItems(obj.parentNode.parentNode)
                return;
            }
            clearSelectedItems(obj.parentNode);   //清空選擇項
            var cbArr = obj.parentNode.cells[0].getElementsByTagName("input");
            if (cbArr.length > 0 && cbArr[0].type == "checkbox") {
                cbArr[0].checked = !cbArr[0].checked;
            }
        }

        /*清空選擇項*/
        function clearSelectedItems(row) {
            var myTable = document.getElementById("myTable");
            var cbArr = myTable.getElementsByTagName("input");
            for (var i = 0; i < cbArr.length; i++) {
                if (cbArr[i].parentNode.parentNode != row) {
                    if (cbArr[i].type == "checkbox" && cbArr[i].checked) {
                        cbArr[i].checked = false;
                    }
                }
            }
        }
        
        function Focus(obj) {
            obj.style.backgroundColor = '#D8F79D';
        }
        //顏色恢復為白色
        function UnFocus(obj) {
            obj.style.backgroundColor = '#ffffff';
        }
    </script>

                      <table width="100%" id="myTable" cellspacing="0" cellpadding="2" size="15" class="dataTable">
                            <tbody>
                                <tr class="dataTableHead">
                                    <td width="5%" height="30" align="center">
                                        <strong>選擇</strong>
                                    </td>
                                    <td width="15%" style="cursor: pointer" align="center">
                                        <strong>書籍圖片</strong>
                                    </td>
                                    <td width="15%" align="center">
                                        <strong>書名</strong>
                                    </td>
                                    <td width="15%" align="center">
                                        <strong>作者</strong>
                                    </td>
                                    <td width="10%" style="cursor: pointer;" align="center">
                                        <strong>書籍類別</strong>
                                    </td>
                                    <td width="15%" align="center">
                                        <strong>已閱讀此書人數</strong>
                                    </td>
                                    <td width="15%" align="center">
                                        <strong>是否必讀</strong>
                                    </td>
                                    <td width="10%" align="center">
                                        <strong>檢視詳情</strong>
                                    </td>
                                </tr>
                                <asp:Repeater ID="rp_list" runat="server" 
                                    OnItemDataBound="rp_list_ItemDataBound">
                                    <ItemTemplate>
                                        <tr onmouseover="Focus(this)"  style="cursor: pointer" onmouseout="UnFocus(this)" onclick="OnCheck(event)">
                                            <td align="center">
                                                <input type="checkbox" id="cb_i" name="cb_i" value="<%#Eval("BookID") %>" class="inputCheckbox" />
                                            </td>
                                            <td align="center">
                                                <asp:Image ID="Image1" ToolTip='<%#Eval("BookName") %>' runat="server" Width="80"
                                                    Height="100" ImageUrl='<%#Eval("BookPic")%>' />
                                            </td>
                                            <td align="center">
                                                <%# Eval("BookName")%>
                                            </td>
                                            <td align="center">
                                                <%# Eval("Author")%>
                                            </td>
                                            <td align="center">
                                                <%#getBookCategoryNameById(int.Parse(Eval("BookCategoryID").ToString()))%>
                                            </td>
                                            <td align="center">
                                                <asp:LinkButton ID="lb" runat="server" Text='<%# getBookReadCounter(int.Parse(Eval("BookID").ToString()))%>'
                                                    CommandArgument='<%#Eval("BookID")%>'></asp:LinkButton>
                                            </td>
                                            <td align="center">
                                                <asp:Label ID="lblMustRead" runat="server" Text='<%# getIsMustRead(int.Parse(Eval("IsMustRead").ToString()))%>'></asp:Label>
                                            </td>
                                            <td align="center">
                                                <asp:ImageButton ID="ibSeeDetail" ImageUrl="~/Admin/images/details.jpg" OnClientClick="SeeTemplate();"
                                                    CommandArgument='<%#Eval("BookID") %>' ToolTip="檢視詳細資訊" runat="server" />
                                            </td>
                                        </tr>
                                    </ItemTemplate>
                                </asp:Repeater>
                                <tr>
                                    <td colspan="8" align="left">
                                        <webdiyer:AspNetPager Style="float: right;" PageSize="3" ID="AspNetPager1" runat="server"
                                            CustomInfoHTML="" FirstPageText="第一頁" LastPageText="最末頁" NextPageText="下一頁" PrevPageText="上一頁"
                                            OnPageChanged="AspNetPager1_PageChanged" ShowPageIndexBox="Never" UrlPaging="false"
                                            Width="100%" ShowCustomInfoSection="Left" SubmitButtonClass="inputButton" SubmitButtonText="轉跳"
                                            PageIndexBoxType="DropDownList" PageIndexOutOfRangeErrorMessage="您訪問的地址不正確!">
                                        </webdiyer:AspNetPager>
                                    </td>
                                </tr>
                            </tbody>
                        </table>



            

相關文章