CSDN首页 空间 新闻 论坛 Blog 下载 读书 网摘 搜索 .NET Java 视频 接项目 求职 在线学习 买书 程序员 通知
可用分押宝游戏火热进行中... 专题改版：Java Web 专题
CSDN社区
搜索 收藏 打印 关闭
CSDN社区 >  Web 开发 >  JavaScript

关于表格奇偶行颜色、选中颜色、 onmouseover的颜色、onmouseout的颜色的问题，多谢大家了！

楼主ken2002（尖刀）2005-06-02 11:32:27 在 Web 开发 / JavaScript 提问

<HTML>  
  <HEAD>  
  <META   http-equiv="Content-Type"   content="text/html;   charset=gb2312">  
  <TITLE>table颜色变换</TITLE>  
  </HEAD>  
  <BODY>  
  <DIV   ALIGN="CENTER">  
  <TABLE   BORDER="1"   cellspacing="0"   cellpadding="0">  
  <TR>  
          <TD>第一列</TD>  
          <TD>第二列</TD>  
          <TD>第三列</TD>  
  <TD>第四列</TD>  
          <TD>第五列</TD>  
          <TD>第六列</TD>  
  <TD>第七列</TD>  
          <TD>第八列</TD>  
      </TR>  
          <TR>  
                  <TD   WIDTH="88">11</TD>  
                  <TD   WIDTH="88">12</TD>  
                  <TD   WIDTH="88">13</TD>  
                  <TD   WIDTH="88">14</TD>  
                  <TD   WIDTH="88">15</TD>  
                  <TD   WIDTH="88">16</TD>  
                  <TD   WIDTH="88">17</TD>  
                  <TD   WIDTH="88">18</TD>  
          </TR>  
          <TR>  
                  <TD>21</TD>  
                  <TD>22</TD>  
                  <TD>23</TD>  
                  <TD>24</TD>  
                  <TD>25</TD>  
                  <TD>26</TD>  
                  <TD>27</TD>  
                  <TD>28</TD>  
          </TR>  
          <TR>  
                  <TD>31</TD>  
                  <TD>32</TD>  
                  <TD>33</TD>  
                  <TD>34</TD>  
                  <TD>35</TD>  
                  <TD>36</TD>  
                  <TD>37</TD>  
                  <TD>38</TD>  
          </TR>  
          <TR>  
                  <TD>41</TD>  
                  <TD>42</TD>  
                  <TD>43</TD>  
                  <TD>44</TD>  
                  <TD>45</TD>  
                  <TD>46</TD>  
                  <TD>47</TD>  
                  <TD>48</TD>  
          </TR>  
          <TR>  
                  <TD>51</TD>  
                  <TD>52</TD>  
                  <TD>53</TD>  
                  <TD>54</TD>  
                  <TD>55</TD>  
                  <TD>56</TD>  
                  <TD>57</TD>  
                  <TD>58</TD>  
          </TR>  
  </TABLE>  
  </DIV>  
  </BODY>  
  </HTML>  
   
   
  在想在以上情况下，实现奇偶行颜色的动态不同（奇行是一种颜色，偶行是另外一种颜色），选中颜色、   onmouseover的颜色、onmouseout的颜色  
   
  不知大家能明白我的意思么，多谢大家了 问题点数：20、回复次数：18Top

1 楼treeroot（旗鲁特）回复于 2005-06-02 11:39:37 得分 2

明白，很简单，用样式表定义就好了Top

2 楼ken2002（尖刀）回复于 2005-06-02 11:47:10 得分 0

To     treeroot(旗鲁特)    
  麻烦你帮我写个完整的可以么，多谢你了！Top

3 楼net_lover（【孟子E章】）回复于 2005-06-02 14:38:17 得分 18

http://dotnet.aspx.cc/ShowList.aspx?id=1  
  的源代码Top

4 楼ken2002（尖刀）回复于 2005-06-02 14:55:46 得分 0

To   net_lover(孟子E章)    
   
  好象没有被选中的功能的呀，被选中的功能意思是：如果选择第一行后，第一行变为红色，这是如果再选择第二行，第二行变成红色，同时第一行就变为原来的颜色，多谢你了Top

5 楼treeroot（旗鲁特）回复于 2005-06-02 15:10:48 得分 0

鼠标经过不就是选中吗Top

6 楼ken2002（尖刀）回复于 2005-06-02 15:21:15 得分 0

回复人：   treeroot(旗鲁特)   (   )   信誉：100     2005-06-02   15:10:00     得分:   0      
     
     
        鼠标经过不就是选中吗  
       
     
   
   
  鼠标选中指的是点击鼠标左键，被选中的功能意思是：如果选择第一行后，第一行变为红色，这是如果再选择第二行，第二行变成红色，同时第一行就变为原来的颜色，多谢你了  
   
  同时也要有onmouseover事件和onmouseout事件，多谢了Top

7 楼HHH3000（蓝色爱琴海 知耻而后勇）回复于 2005-06-02 16:48:01 得分 0

http://blog.csdn.net/wanghr100/archive/2003/11/23/16364.aspx  
   
  其他效果可以仿照添加~~Top

8 楼treeroot（旗鲁特）回复于 2005-06-02 16:53:22 得分 0

那你就加一个onClick事件吧  
  Top

9 楼net_lover（【孟子E章】）回复于 2005-06-02 17:03:45 得分 0

<HTML>  
  <HEAD>  
  <META   http-equiv="Content-Type"   content="text/html;   charset=gb2312">  
  <TITLE>table颜色变换</TITLE>  
  <script>  
  var   nn   =   1  
  function   init()  
  {  
  o   =   document.getElementById("tb").rows  
  for(i   =   0;i<o.length;i++)  
  {  
  if(i   %   2   ==   0   )    
  o[i].bgColor="red"  
  else  
  o[i].bgColor="GREEN"  
  if(document.getElementById("tb").getAttribute("where")   !=   "")  
  document.getElementById("tb").rows[parseInt(document.getElementById("tb").getAttribute("where"))].bgColor="#FF00FF"  
  if(1==nn)  
  {  
  o[i].attachEvent("onmouseover",mov)  
  o[i].attachEvent("onmouseoutr",mot)  
  }  
  }  
   
  nn++  
  }  
   
  function   mov()  
  {  
  init()  
  e   =   event.srcElement  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  e.bgColor="#0000FF"  
  }  
   
  function   mot()  
  {  
  init()  
  }  
  function   SetColor()  
  {  
   
  e   =   event.srcElement  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  {  
  e.bgColor="#FF00FF"  
  document.getElementById("tb").setAttribute("where",e.rowIndex)  
  }  
  init()  
  }  
  </script>  
  </HEAD>  
  <BODY   ONLOAD="init()">  
  <DIV   ALIGN="CENTER">  
  <TABLE   BORDER="1"   cellspacing="0"   cellpadding="0"   onclick="SetColor()"   id=tb   where="">  
  <Tr>  
          <TD>第一列</TD>  
          <TD>第二列</TD>  
          <TD>第三列</TD>  
  <TD>第四列</TD>  
          <TD>第五列</TD>  
          <TD>第六列</TD>  
  <TD>第七列</TD>  
          <TD>第八列</TD>  
      </TR>  
          <TR>  
                  <TD   WIDTH="88">11</TD>  
                  <TD   WIDTH="88">12</TD>  
                  <TD   WIDTH="88">13</TD>  
                  <TD   WIDTH="88">14</TD>  
                  <TD   WIDTH="88">15</TD>  
                  <TD   WIDTH="88">16</TD>  
                  <TD   WIDTH="88">17</TD>  
                  <TD   WIDTH="88">18</TD>  
          </TR>  
          <TR>  
                  <TD>21</TD>  
                  <TD>22</TD>  
                  <TD>23</TD>  
                  <TD>24</TD>  
                  <TD>25</TD>  
                  <TD>26</TD>  
                  <TD>27</TD>  
                  <TD>28</TD>  
          </TR>  
          <TR>  
                  <TD>31</TD>  
                  <TD>32</TD>  
                  <TD>33</TD>  
                  <TD>34</TD>  
                  <TD>35</TD>  
                  <TD>36</TD>  
                  <TD>37</TD>  
                  <TD>38</TD>  
          </TR>  
          <TR>  
                  <TD>41</TD>  
                  <TD>42</TD>  
                  <TD>43</TD>  
                  <TD>44</TD>  
                  <TD>45</TD>  
                  <TD>46</TD>  
                  <TD>47</TD>  
                  <TD>48</TD>  
          </TR>  
          <TR>  
                  <TD>51</TD>  
                  <TD>52</TD>  
                  <TD>53</TD>  
                  <TD>54</TD>  
                  <TD>55</TD>  
                  <TD>56</TD>  
                  <TD>57</TD>  
                  <TD>58</TD>  
          </TR>  
  </TABLE>  
  </DIV>  
  </BODY>  
  </HTML>Top

10 楼treeroot（旗鲁特）回复于 2005-06-02 17:07:07 得分 0

楼上的真实牛呀,佩服Top

11 楼ken2002（尖刀）回复于 2005-06-02 17:25:01 得分 0

To   net_lover(孟子E章)    
   
  多谢你了，不过我不想第一行，参与颜色的变换，不知可以实现么，多谢你了  
   
  还有一个，如果点得多次的话，会出现  
   
  行：46  
  字符：2  
  错误：缺少对象  
  代码：0  
   
  的提示信息，麻烦你帮我看看，多谢你了Top

12 楼net_lover（【孟子E章】）回复于 2005-06-03 09:20:35 得分 0

<HTML>  
  <HEAD>  
  <META   http-equiv="Content-Type"   content="text/html;   charset=gb2312">  
  <TITLE>table颜色变换</TITLE>  
  <script>  
  var   nn   =   1  
  function   init()  
  {  
  o   =   document.getElementById("tb").rows  
  for(i   =   1;i<o.length;i++)  
  {  
  if(i   %   2   ==   0   )    
  o[i].bgColor="red"  
  else  
  o[i].bgColor="GREEN"  
  if(document.getElementById("tb").getAttribute("where")   !=   "")  
  document.getElementById("tb").rows[parseInt(document.getElementById("tb").getAttribute("where"))].bgColor="#FF00FF"  
  if(1==nn)  
  {  
  o[i].attachEvent("onmouseover",mov)  
  o[i].attachEvent("onmouseoutr",mot)  
  }  
  }  
   
  nn++  
  }  
   
  function   mov()  
  {  
  init()  
  e   =   event.srcElement  
  if(e.tagName=="TABLE"   ||   e.tagName=="TBODY")   return  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  e.bgColor="#0000FF"  
  }  
   
  function   mot()  
  {  
  init()  
  }  
  function   SetColor()  
  {  
  e   =   event.srcElement  
  if(e.tagName=="TABLE"   ||   e.tagName=="TBODY")   return  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  {  
  e.bgColor="#FF00FF"  
  document.getElementById("tb").setAttribute("where",e.rowIndex)  
  }  
  init()  
  }  
  </script>  
  </HEAD>  
  <BODY   ONLOAD="init()">  
  <DIV   ALIGN="CENTER">  
  <TABLE   BORDER="1"   cellspacing="0"   cellpadding="0"   onclick="SetColor()"   id=tb   where="">  
  <Tr>  
          <TD>第一列</TD>  
          <TD>第二列</TD>  
          <TD>第三列</TD>  
  <TD>第四列</TD>  
          <TD>第五列</TD>  
          <TD>第六列</TD>  
  <TD>第七列</TD>  
          <TD>第八列</TD>  
      </TR>  
          <TR>  
                  <TD   WIDTH="88">11</TD>  
                  <TD   WIDTH="88">12</TD>  
                  <TD   WIDTH="88">13</TD>  
                  <TD   WIDTH="88">14</TD>  
                  <TD   WIDTH="88">15</TD>  
                  <TD   WIDTH="88">16</TD>  
                  <TD   WIDTH="88">17</TD>  
                  <TD   WIDTH="88">18</TD>  
          </TR>  
          <TR>  
                  <TD>21</TD>  
                  <TD>22</TD>  
                  <TD>23</TD>  
                  <TD>24</TD>  
                  <TD>25</TD>  
                  <TD>26</TD>  
                  <TD>27</TD>  
                  <TD>28</TD>  
          </TR>  
          <TR>  
                  <TD>31</TD>  
                  <TD>32</TD>  
                  <TD>33</TD>  
                  <TD>34</TD>  
                  <TD>35</TD>  
                  <TD>36</TD>  
                  <TD>37</TD>  
                  <TD>38</TD>  
          </TR>  
          <TR>  
                  <TD>41</TD>  
                  <TD>42</TD>  
                  <TD>43</TD>  
                  <TD>44</TD>  
                  <TD>45</TD>  
                  <TD>46</TD>  
                  <TD>47</TD>  
                  <TD>48</TD>  
          </TR>  
          <TR>  
                  <TD>51</TD>  
                  <TD>52</TD>  
                  <TD>53</TD>  
                  <TD>54</TD>  
                  <TD>55</TD>  
                  <TD>56</TD>  
                  <TD>57</TD>  
                  <TD>58</TD>  
          </TR>  
  </TABLE>  
  </DIV>  
  </BODY>  
  </HTML>  
  Top

13 楼ken2002（尖刀）回复于 2005-06-03 09:41:43 得分 0

To   net_lover(孟子E章)    
   
  还是有点问题，就是点到标题的时候，颜色我不想让他变，我想让他保留原来的颜色，应该怎么做呢，多谢你了Top

14 楼net_lover（【孟子E章】）回复于 2005-06-03 09:56:57 得分 0

<HTML>  
  <HEAD>  
  <META   http-equiv="Content-Type"   content="text/html;   charset=gb2312">  
  <TITLE>table颜色变换</TITLE>  
  <script>  
  var   nn   =   1  
  function   init()  
  {  
  o   =   document.getElementById("tb").rows  
  for(i   =   1;i<o.length;i++)  
  {  
  if(i   %   2   ==   0   )    
  o[i].bgColor="red"  
  else  
  o[i].bgColor="GREEN"  
  if(document.getElementById("tb").getAttribute("where")   !=   "")  
  document.getElementById("tb").rows[parseInt(document.getElementById("tb").getAttribute("where"))].bgColor="#FF00FF"  
  if(1==nn)  
  {  
  o[i].attachEvent("onmouseover",mov)  
  o[i].attachEvent("onmouseoutr",mot)  
  }  
  }  
   
  nn++  
  }  
   
  function   mov()  
  {  
  init()  
  e   =   event.srcElement  
  if(e.tagName=="TABLE"   ||   e.tagName=="TBODY")   return  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  e.bgColor="#0000FF"  
  }  
   
  function   mot()  
  {  
  init()  
  }  
  function   SetColor()  
  {  
  e   =   event.srcElement  
  if(e.tagName=="TABLE"   ||   e.tagName=="TBODY")   return  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  {  
  if(e.rowIndex==0)   return  
  e.bgColor="#FF00FF"  
  document.getElementById("tb").setAttribute("where",e.rowIndex)  
  }  
  init()  
  }  
  </script>  
  </HEAD>  
  <BODY   ONLOAD="init()">  
  <DIV   ALIGN="CENTER">  
  <TABLE   BORDER="1"   cellspacing="0"   cellpadding="0"   onclick="SetColor()"   id=tb   where="">  
  <Tr>  
          <TD>第一列</TD>  
          <TD>第二列</TD>  
          <TD>第三列</TD>  
  <TD>第四列</TD>  
          <TD>第五列</TD>  
          <TD>第六列</TD>  
  <TD>第七列</TD>  
          <TD>第八列</TD>  
      </TR>  
          <TR>  
                  <TD   WIDTH="88">11</TD>  
                  <TD   WIDTH="88">12</TD>  
                  <TD   WIDTH="88">13</TD>  
                  <TD   WIDTH="88">14</TD>  
                  <TD   WIDTH="88">15</TD>  
                  <TD   WIDTH="88">16</TD>  
                  <TD   WIDTH="88">17</TD>  
                  <TD   WIDTH="88">18</TD>  
          </TR>  
          <TR>  
                  <TD>21</TD>  
                  <TD>22</TD>  
                  <TD>23</TD>  
                  <TD>24</TD>  
                  <TD>25</TD>  
                  <TD>26</TD>  
                  <TD>27</TD>  
                  <TD>28</TD>  
          </TR>  
          <TR>  
                  <TD>31</TD>  
                  <TD>32</TD>  
                  <TD>33</TD>  
                  <TD>34</TD>  
                  <TD>35</TD>  
                  <TD>36</TD>  
                  <TD>37</TD>  
                  <TD>38</TD>  
          </TR>  
          <TR>  
                  <TD>41</TD>  
                  <TD>42</TD>  
                  <TD>43</TD>  
                  <TD>44</TD>  
                  <TD>45</TD>  
                  <TD>46</TD>  
                  <TD>47</TD>  
                  <TD>48</TD>  
          </TR>  
          <TR>  
                  <TD>51</TD>  
                  <TD>52</TD>  
                  <TD>53</TD>  
                  <TD>54</TD>  
                  <TD>55</TD>  
                  <TD>56</TD>  
                  <TD>57</TD>  
                  <TD>58</TD>  
          </TR>  
  </TABLE>  
  </DIV>  
  </BODY>  
  </HTML>  
  Top

15 楼ken2002（尖刀）回复于 2005-06-03 10:11:24 得分 0

To     net_lover(孟子E章)    
   
  我都不好意思再麻烦你了  
   
  有个问题我没有注意到，就是移动的时候变成蓝色的情况  
   
  比如我用鼠标移动到第一行时，变成蓝色的时候，如果再把鼠标移到table外时，颜色不能变成蓝色的，如果有用鼠标的左键选中的颜色就是粉红色还是不变，多谢你了Top

16 楼ken2002（尖刀）回复于 2005-06-03 14:52:37 得分 0

To     net_lover(孟子E章)    
   
  不知我的解释你是否明白，我现在需要你的帮忙，多谢你了Top

17 楼net_lover（【孟子E章】）回复于 2005-06-03 15:16:41 得分 0

<HTML>  
  <HEAD>  
  <META   http-equiv="Content-Type"   content="text/html;   charset=gb2312">  
  <TITLE>table颜色变换</TITLE>  
  <script>  
  var   nn   =   1  
  function   init()  
  {  
  o   =   document.getElementById("tb").rows  
  for(i   =   1;i<o.length;i++)  
  {  
  if(i   %   2   ==   0   )    
  o[i].bgColor="red"  
  else  
  o[i].bgColor="green"  
  if(document.getElementById("tb").getAttribute("where")   !=   "")  
  document.getElementById("tb").rows[parseInt(document.getElementById("tb").getAttribute("where"))].bgColor="#FF00FF"  
  if(1==nn)  
  {  
  o[i].attachEvent("onmouseover",mov)  
  o[i].attachEvent("onmouseoutr",mot)  
  }  
  }  
   
  nn++  
  }  
   
  function   mov()  
  {  
  init()  
  e   =   event.srcElement  
  if(e.tagName=="TABLE"   ||   e.tagName=="TBODY")   return  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  e.bgColor="#0000FF"  
  }  
   
  function   mot()  
  {  
  init()  
  }  
  function   SetColor()  
  {  
  e   =   event.srcElement  
  if(e.tagName=="TABLE"   ||   e.tagName=="TBODY")   return  
  while(e.tagName   !=   "TR")  
  e   =   e.parentElement  
  if(e.tagName=="TR")  
  {  
  if(e.rowIndex==0)   return  
  e.bgColor="#FF00FF"  
  document.getElementById("tb").setAttribute("where",e.rowIndex)  
  }  
  init()  
  }  
  </script>  
  </HEAD>  
  <BODY   ONLOAD="init()">  
  <DIV   ALIGN="CENTER">  
  <TABLE   BORDER="1"   cellspacing="0"   cellpadding="0"   onclick="SetColor()"   onmouseout="mot()"   id=tb   where="">  
  <Tr>  
          <TD>第一列</TD>  
          <TD>第二列</TD>  
          <TD>第三列</TD>  
  <TD>第四列</TD>  
          <TD>第五列</TD>  
          <TD>第六列</TD>  
  <TD>第七列</TD>  
          <TD>第八列</TD>  
      </TR>  
          <TR>  
                  <TD   WIDTH="88">11</TD>  
                  <TD   WIDTH="88">12</TD>  
                  <TD   WIDTH="88">13</TD>  
                  <TD   WIDTH="88">14</TD>  
                  <TD   WIDTH="88">15</TD>  
                  <TD   WIDTH="88">16</TD>  
                  <TD   WIDTH="88">17</TD>  
                  <TD   WIDTH="88">18</TD>  
          </TR>  
          <TR>  
                  <TD>21</TD>  
                  <TD>22</TD>  
                  <TD>23</TD>  
                  <TD>24</TD>  
                  <TD>25</TD>  
                  <TD>26</TD>  
                  <TD>27</TD>  
                  <TD>28</TD>  
          </TR>  
          <TR>  
                  <TD>31</TD>  
                  <TD>32</TD>  
                  <TD>33</TD>  
                  <TD>34</TD>  
                  <TD>35</TD>  
                  <TD>36</TD>  
                  <TD>37</TD>  
                  <TD>38</TD>  
          </TR>  
          <TR>  
                  <TD>41</TD>  
                  <TD>42</TD>  
                  <TD>43</TD>  
                  <TD>44</TD>  
                  <TD>45</TD>  
                  <TD>46</TD>  
                  <TD>47</TD>  
                  <TD>48</TD>  
          </TR>  
          <TR>  
                  <TD>51</TD>  
                  <TD>52</TD>  
                  <TD>53</TD>  
                  <TD>54</TD>  
                  <TD>55</TD>  
                  <TD>56</TD>  
                  <TD>57</TD>  
                  <TD>58</TD>  
          </TR>  
  </TABLE>  
  </DIV>  
  </BODY>  
  </HTML>Top

18 楼ken2002（尖刀）回复于 2005-06-03 17:39:16 得分 0

To   net_lover(孟子E章)  
   
  非常非常感谢你，基本上达到要求了，太感谢你了，我再测试一下，多谢你了Top

相关问题

  • 求奇偶数
  • 谁知道奇偶排序法?
  • xsl页面输出奇偶问题
  • onMouseover 和 onMouseout的奇怪问题
  • 请帮忙，多谢，多谢！
  • 求助！多谢！！！
  • 多谢关照
  • 多谢指教……
  • To daiwoo,多谢
  • 多谢了！

关键词

得分解答快速导航

  • 帖主：ken2002
  • treeroot
  • net_lover

相关链接

  • Web开发类图书

广告也精彩

反馈

请通过下述方式给我们反馈
反馈
提问
网站简介|广告服务|VIP资费标准|银行汇款帐号|网站地图|帮助|联系方式|诚聘英才|English|问题报告
世纪乐知(北京)网络技术有限公司 版权所有, 京 ICP 证 020026 号
北京创新乐知广告有限公司 提供技术支持
Copyright © 2000-2007, CSDN.NET, All Rights Reserved
GongshangLogo