首页 新闻 搜索 专区 学院

JQuery查找数据,并进行比较的问题

0
悬赏园豆:40 [已解决问题] 解决于 2013-07-12 10:23

例如:     这一行的第一个数字05,我想将围红中05下对用的这个单元格的背景色填充为红色     这二行的第二个数字10,我想将围红中10下对用的这个单元格的背景色填充为红色     ……     以此类推         当然了,整个红球这一大列的数字(6个数)是变化的,         我想用JQuery来实现,如果您有更好的想法,也可以

 我借鉴了别人的方法,但是这个方法,都把背景色填充到了第一行,

<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style type="text/css"> body table tr td{width:18px; height:18px; text-align:center; } </style> <script src="JQuery/jquery-1.10.1.js" type="text/javascript"> </script> <!--  例如:     这一行的第一个数字05,我想将围红中05下对用的这个单元格的背景色填充为红色     这二行的第二个数字10,我想将围红中10下对用的这个单元格的背景色填充为红色     ……     以此类推         当然了,整个红球这一大列的数字(6个数)是变化的,         我想用JQuery来实现,如果您有更好的想法,也可以

 我借鉴了别人的方法,但是这个方法,都把背景色填充到了第一行, --> <script type="text/javascript"> $(document).ready(function() {     var tds =  $("td.red_two");  alert(tds.length);     $("td.red_one").each(function(){         var num = parseInt(this.innerHTML);   alert(num);         tds[num - 1].style.backgroundColor = "red";     }); });

</script> </head>

<body>

<br> <br> <table align="center" border="1" cellspacing="0" cellpadding="0">   <tr>     <td rowspan="2">期号</td>     <td colspan="6">红球</td>     <td rowspan="2">蓝球</td>     <td colspan="33">围红</td>     <td rowspan="2">验证</td>   </tr>   <tr>     <td>一</td>     <td>二</td>     <td>三</td>     <td>四</td>     <td>五</td>     <td>六</td>     <td>01</td>     <td>02</td>     <td>03</td>     <td>04</td>     <td>05</td>     <td>06</td>     <td>07</td>     <td>08</td>     <td>09</td>     <td>10</td>     <td>11</td>     <td>12</td>     <td>13</td>     <td>14</td>     <td>15</td>     <td>16</td>     <td>17</td>     <td>18</td>     <td>19</td>     <td>20</td>     <td>21</td>     <td>22</td>     <td>23</td>     <td>24</td>     <td>25</td>     <td>26</td>     <td>27</td>     <td>28</td>     <td>29</td>     <td>30</td>     <td>31</td>     <td>32</td>     <td>33</td>   </tr>   <tr>     <td>&nbsp;</td>     <td class="red_one">05</td>     <td class="red_one">09</td>     <td class="red_one">14</td>     <td class="red_one">17</td>     <td class="red_one">23</td>     <td class="red_one">29</td>     <td>&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td>&nbsp;</td>   </tr>   <tr>     <td>&nbsp;</td>     <td class="red_one">04</td>     <td class="red_one">10</td>     <td class="red_one">14</td>     <td class="red_one">22</td>     <td class="red_one">28</td>     <td class="red_one">32</td>     <td>&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td class="red_two">&nbsp;</td>     <td>&nbsp;</td>   </tr> </table> </body> </html>

horse_leo的主页 horse_leo | 初学一级 | 园豆:17
提问于:2013-07-11 13:54
< >
分享
最佳答案
1
<script type="text/javascript">
$(document).ready(function() {
    var tds =  $("td.red_two");
    $("td.red_one").each(function(){
        var num = parseInt(this.innerHTML);
        tds[num - 1].style.backgroundColor = "red";
    });
});
    
</script>
收获园豆:40
我是流氓 | 初学一级 |园豆:20 | 2013-07-11 15:09

你好!非常感谢您的回复,您的程序非常好,我已经在单独的Html中运行成功,但是我的源程序是

1、连接

<td class="p"><a class="list" target="_blank" href="SearchDdwhoneServlet">大底围红(01)</a></td>

2、SearchDdwhoneServlet(因为数据都是从数据库中查询得到的)

package com.chk.doubleball.setvlet;

import java.io.IOException;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.chk.doubleball.model.DdwhOne;
import com.chk.doubleball.util.DBUtil;

public class SearchDdwhoneServlet extends HttpServlet {

    private static final long serialVersionUID = 1L;

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 1、查询数据
        List<DdwhOne> ddwhoneList = new ArrayList<>();
        String sql = "select * from t_ddwh01 where _id > (select count(*) from t_ddwh01) - 100;";
        Connection conn = DBUtil.getConn();
        PreparedStatement pstmt = null;
        ResultSet rs = null;
        try {
            pstmt = conn.prepareStatement(sql);
            rs = pstmt.executeQuery();
            while (rs.next()) {
                DdwhOne d = new DdwhOne();
                d.set_id(rs.getInt("_id"));
                d.setIssue(rs.getInt("issue"));
                d.setOrder_red_one(rs.getString("order_red_one"));
                d.setOrder_red_two(rs.getString("order_red_two"));
                d.setOrder_red_three(rs.getString("order_red_three"));
                d.setOrder_red_four(rs.getString("order_red_four"));
                d.setOrder_red_five(rs.getString("order_red_five"));
                d.setOrder_red_six(rs.getString("order_red_six"));
                d.setBlue(rs.getString("blue"));
                d.setW_one(rs.getString("w_one"));
                d.setW_two(rs.getString("w_two"));
                d.setW_three(rs.getString("w_three"));
                d.setW_four(rs.getString("w_four"));
                d.setW_five(rs.getString("w_five"));
                d.setW_six(rs.getString("w_six"));
                d.setW_seven(rs.getString("w_seven"));
                d.setW_eight(rs.getString("w_eight"));
                d.setW_nine(rs.getString("w_nine"));
                d.setW_ten(rs.getString("w_ten"));
                d.setW_eleven(rs.getString("w_eleven"));
                d.setW_twelve(rs.getString("w_twelve"));
                d.setW_thirteen(rs.getString("w_thirteen"));
                d.setW_fourteen(rs.getString("w_fourteen"));
                d.setW_fifteen(rs.getString("w_fifteen"));
                d.setW_sixteen(rs.getString("w_sixteen"));
                d.setW_seventeen(rs.getString("w_seventeen"));
                d.setW_eighteen(rs.getString("w_eighteen"));
                d.setW_nineteen(rs.getString("w_nineteen"));
                d.setW_twenty(rs.getString("w_twenty"));
                d.setW_twentyone(rs.getString("w_twentyone"));
                d.setW_twentytwo(rs.getString("w_twentytwo"));
                d.setW_twentythree(rs.getString("w_twentythree"));
                d.setW_twentyfour(rs.getString("w_twentyfour"));
                d.setW_twentyfive(rs.getString("w_twentyfive"));
                d.setW_twentysix(rs.getString("w_twentysix"));
                d.setW_twentyseven(rs.getString("w_twentyseven"));
                d.setW_twentyeight(rs.getString("w_twentyeight"));
                d.setW_twentynine(rs.getString("w_twentynine"));
                d.setW_thirty(rs.getString("w_thirty"));
                d.setW_thirtyone(rs.getString("w_thirtyone"));
                d.setW_thirtytwo(rs.getString("w_thirtytwo"));
                d.setW_thirtythree(rs.getString("w_thirtythree"));
                d.setStatistics(rs.getInt("statistics"));

                ddwhoneList.add(d);
            }
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } finally {
            DBUtil.close(rs);
            DBUtil.close(pstmt);
            DBUtil.close(conn);
        }
        request.setAttribute("ddwhoneList", ddwhoneList);
        // 2、跳转
        request.getRequestDispatcher("/table/table_dadiweihong.jsp").forward(request, response);

    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }

}

3、调整的最终页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>综合图表——>大底围红(一)</title>

<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">
<!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
<script type="text/javascript" src="/js/jquery-1.10.1.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
        var tds = $("td.red_one");
        $("td.red").each(function() {
            var num = parseInt(this.innerHTML);
            tds[num - 1].style.backgroundColor = "red";
        });
    });
</script>
<style type="text/css">
body table {
    border: 1px solid #666666;
    text-align: center;
    font-size: 14px;
    color: #FFFFFF;
}

body table tr,td {
    border: 1px solid #666666;
    height: 18px;
}

.red {
    width: 18px;
    height: 18px;
    background-color: #D40000
}

.blue {
    width: 18px;
    height: 18px;
    background-color: #2A1FAA;
}

.yellow {
    width: 18px;
    height: 18px;
    background-color: #FF7F00;
}
</style>

</head>

<body>
    <!-- title -->
    <jsp:include page="/global/title.jsp"></jsp:include>
    <!-- logo -->
    <jsp:include page="/global/logo.jsp"></jsp:include>
    <!-- navigation -->
    <jsp:include page="/global/navigation.jsp"></jsp:include>
    <!-- roll -->
    <jsp:include page="/global/roll.jsp"></jsp:include>

    <br>

    <table cellspacing="0" cellpadding="0" align="center">
        <tr>
            <td rowspan="2" width="70">期号</td>
            <td class="red" colspan="6">开奖号码</td>
            <td class="blue" rowspan="2">蓝球</td>
            <td class="yellow" colspan="33">围红</td>
            <td rowspan="2" width="50">验证</td>

        </tr>
        <tr>
            <td class="red">一</td>
            <td class="red">二</td>
            <td class="red">三</td>
            <td class="red">四</td>
            <td class="red">五</td>
            <td class="red">六</td>
            <td class="yellow">01</td>
            <td class="yellow">02</td>
            <td class="yellow">03</td>
            <td class="yellow">04</td>
            <td class="yellow">05</td>
            <td class="yellow">06</td>
            <td class="yellow">07</td>
            <td class="yellow">08</td>
            <td class="yellow">09</td>
            <td class="yellow">10</td>
            <td class="yellow">11</td>
            <td class="yellow">12</td>
            <td class="yellow">13</td>
            <td class="yellow">14</td>
            <td class="yellow">15</td>
            <td class="yellow">16</td>
            <td class="yellow">17</td>
            <td class="yellow">18</td>
            <td class="yellow">19</td>
            <td class="yellow">20</td>
            <td class="yellow">21</td>
            <td class="yellow">22</td>
            <td class="yellow">23</td>
            <td class="yellow">24</td>
            <td class="yellow">25</td>
            <td class="yellow">26</td>
            <td class="yellow">27</td>
            <td class="yellow">28</td>
            <td class="yellow">29</td>
            <td class="yellow">30</td>
            <td class="yellow">31</td>
            <td class="yellow">32</td>
            <td class="yellow">33</td>

        </tr>
        <tbody>
            <c:if test="${not empty ddwhoneList }">
                <c:forEach items="${ddwhoneList }" var="a">
                    <tr>
                        <td>${a.issue }</td>
                        <td class="red">${a.order_red_one }</td>
                        <td class="red">${a.order_red_two }</td>
                        <td class="red">${a.order_red_three }</td>
                        <td class="red">${a.order_red_four }</td>
                        <td class="red">${a.order_red_five }</td>
                        <td class="red">${a.order_red_six }</td>
                        <td class="blue">${a.blue }</td>
                        <td class="red_one">${a.w_one }</td>
                        <td class="red_one">${a.w_two }</td>
                        <td class="red_one">${a.w_three }</td>
                        <td class="red_one">${a.w_four}</td>
                        <td class="red_one">${a.w_five}</td>
                        <td class="red_one">${a.w_six}</td>
                        <td class="red_one">${a.w_seven}</td>
                        <td class="red_one">${a.w_eight}</td>
                        <td class="red_one">${a.w_nine}</td>
                        <td class="red_one">${a.w_ten}</td>
                        <td class="red_one">${a.w_eleven}</td>
                        <td class="red_one">${a.w_twelve}</td>
                        <td class="red_one">${a.w_thirteen}</td>
                        <td class="red_one">${a.w_fourteen}</td>
                        <td class="red_one">${a.w_fifteen}</td>
                        <td class="red_one">${a.w_sixteen}</td>
                        <td class="red_one">${a.w_seventeen}</td>
                        <td class="red_one">${a.w_eighteen}</td>
                        <td class="red_one">${a.w_nineteen}</td>
                        <td class="red_one">${a.w_twenty}</td>
                        <td class="red_one">${a.w_twentyone}</td>
                        <td class="red_one">${a.w_twentytwo}</td>
                        <td class="red_one">${a.w_twentythree}</td>
                        <td class="red_one">${a.w_twentyfour}</td>
                        <td class="red_one">${a.w_twentyfive}</td>
                        <td class="red_one">${a.w_twentysix}</td>
                        <td class="red_one">${a.w_twentyseven}</td>
                        <td class="red_one">${a.w_twentyeight}</td>
                        <td class="red_one">${a.w_twentynine}</td>
                        <td class="red_one">${a.w_thirty}</td>
                        <td class="red_one">${a.w_thirtyone}</td>
                        <td class="red_one">${a.w_thirtytwo}</td>
                        <td class="red_one">${a.w_thirtythree}</td>
                        <td class="red_one">${a.statistics}</td>
                    </tr>
                </c:forEach>
            </c:if>
        </tbody>
    </table>
    <br>
    <!-- footer -->
    <jsp:include page="/global/footer.jsp"></jsp:include>

</body>
</html>

这样的话,JQuery就没法实现了

还要请你再帮我看看了

horse_leo | 园豆:17 (初学一级) | 2013-07-11 15:46

@horse_leo:  

因为不清楚你的数据时怎样的,所以我不知道你最终的页面是怎样。

但是不管数据时怎样,只要你最后呈现在浏览器上的代码是你最开始提交的样子的话,那么jquery是可以运行的啊?

我不知道你说的jquery没法实现是什么意思? 

我猜测是不是因为你的数据不止一行数据?会生成很多期的号码,如果是那样的话,也好解决

$(document).ready(function() {
       $("#tableID(自己设置) > tr").each(function(){
            var tds = $(this).find("td.red_one");
            $(this).find("td.red").each(function() {
            var num = parseInt(this.innerHTML);
            tds[num - 1].style.backgroundColor = "red";
        });
    }); 

}); 
我是流氓 | 园豆:20 (初学一级) | 2013-07-12 16:37
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册