zoukankan      html  css  js  c++  java
  • jquerry之隔行跳色

    效果如下图所示:

    <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
    <%@ taglib prefix="s" uri="/struts-tags"%>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title></title>
    <mce:script type="text/javascript" language="javascript" src="js/jquery-1.4.2.min.js" mce_src="js/jquery-1.4.2.min.js"></mce:script>
    <mce:script type="text/javascript"><!--
    $(document).ready(function(){
    $("select").change(function(){
    var orderid=$("select").val();
    if(orderid!=0){
    window.location.href="listtransInfo.jspx?oid="+orderid;
    }

    });

    $(".table tr").mouseover(function(){
    $(this).addClass("over");
    });
    $(".table tr").mouseout(function(){
    $(this).removeClass("over");
    });
    $(".table tr:even").addClass("alt");

    });


    //
    --></mce:script>

    <mce:style type="text/css"><!--
    body{

    color:#666;
    }

    tr.alt td {
    background:#ecf6fc;
    }

    tr.over td {
    background:#bcd4ec;
    }

    --></mce:style><style type="text/css" mce_bogus="1"> body{

    color
    :#666;
    }

    tr.alt td
    {
    background
    :#ecf6fc;
    }

    tr.over td
    {
    background
    :#bcd4ec;
    }
    </style>

    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    </head>

    <body>

    <br>
    <select name="order">
    <option value="0">排序方式</option>
    <option value="1">按时间排序</option>
    <option value="2">按金额排序</option>
    </select>
    <br>
    <span style="font-size:13px;color:green;" mce_style="font-size:13px;color:green;">共有${pages.totalCount }条数据 每页显示${pages.pageSize }条数据 共分${pages.totalPages }页 当前是第${pages.currentPageNo }页</span>
    <c:choose>
    <c:when test="${pages.currentPageNo == 1}">
    <span style="font-size:13px;" mce_style="font-size:13px;">首页</span>
    </c:when>
    <c:otherwise>
    <a href="listtransInfo.jspx?uid=${user_session.id}&pageNo=1" mce_href="listtransInfo.jspx?uid=${user_session.id}&pageNo=1" style="font-size:13px;" mce_style="font-size:13px;">首页</a>
    </c:otherwise>
    </c:choose>

    <c:choose>
    <c:when test="${pages.hasPavPage}">
    <a href="listtransInfo.jspx?uid=${user_session.id}&pageNo=${pages.currentPageNo -1 }" mce_href="listtransInfo.jspx?uid=${user_session.id}&pageNo=${pages.currentPageNo -1 }" style="font-size:13px;" mce_style="font-size:13px;">上一页</a>
    </c:when>
    <c:otherwise>
    <span style="font-size:13px;" mce_style="font-size:13px;">上一页</span>
    </c:otherwise>
    </c:choose>

    <c:choose>
    <c:when test="${pages.hasNextPage}">
    <a href="listtransInfo.jspx?uid=${user_session.id}&pageNo=${pages.currentPageNo + 1 }" mce_href="listtransInfo.jspx?uid=${user_session.id}&pageNo=${pages.currentPageNo + 1 }" style="font-size:13px;" mce_style="font-size:13px;">下一页</a>
    </c:when>
    <c:otherwise>
    <span style="font-size:13px;" mce_style="font-size:13px;">下一页</span>
    </c:otherwise>
    </c:choose>

    <c:choose>
    <c:when test="${pages.currentPageNo == pages.totalPages}">
    <span style="font-size:13px;" mce_style="font-size:13px;">尾页</span>
    </c:when>
    <c:otherwise>
    <a href="listtransInfo.jspx?uid=${user_session.id}&pageNo=${pages.totalPages }" mce_href="listtransInfo.jspx?uid=${user_session.id}&pageNo=${pages.totalPages }" style="font-size:13px;" mce_style="font-size:13px;">尾页</a>
    </c:otherwise>
    </c:choose>


    <table class="table" style=" font-size:15px;" mce_style=" font-size:15px;"
    align
    ="left" cellspacing="1" border="0" cellpadding="0" bgcolor="green" width="80%" style="color:#333" mce_style="color:#333">

    <tr bgcolor="white">
    <td>收账人姓名</td>
    <td>收账人账号</td>
    <td>转账金额</td>
    <td>日期</td>
    </tr>
    <c:forEach items="${pages.pageList}" var="trans">
    <tr bgcolor="white">
    <td>${trans.user.userName }</td>
    <td>${trans.taccountNum}</td>
    <td>${trans.tmoney }</td>
    <td>${trans.tdate }</td>
    </tr>
    </c:forEach>
    </table>

    </body>
    </html>

  • 相关阅读:
    014
    013
    012
    011
    009
    009
    008
    适用于可迭代对象的通用函数
    ubuntu中将py3设置为默认的python
    linux系统下安装gtk
  • 原文地址:https://www.cnblogs.com/archie2010/p/1945192.html
Copyright © 2011-2022 走看看