如何在运行时更改表中td的颜色 [英] How to Change the color of td in the table at runtime

查看:140
本文介绍了如何在运行时更改表中td的颜色的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的主页日历中,当我选择日期并进入下一页(可用性)时,表中不同日期的不同日期中会有很多详细信息,但我想知道我在哪个日期选择了日期日期详情(td)页面必须在表格(td)中显示为选中(颜色变化),怎么可能?

请帮帮我先生......!

In my Home page calendar,when i select a date and go the next page(availability) there will so many Details in different Dates in different td in the table but i want that in which date that i had selected Date in Home page that date Details(td)have to show as selected(colorchange) in the table(td),how it is possible?
please help me sir...!

推荐答案

我建​​议在jQuery中使用CSS。请参阅:

http://api.jquery.com/category/css/ [ ^ ],

http://api.jquery.com/addClass/ [ ^ ],

http: //api.jquery.com/removeClass/ [ ^ ],

http://api.jquery.com/toggleClass/ [ ^ ]。



想法是:为同一元素创建两种不同的样式,使用不同的颜色,并使用方法 .addClass()从一个元素切换到另一个元素。 removeClass() .toggleClass()



请参阅上面引用的代码示例文档;如果您需要了解它,请参阅其他CSS方法并查看jQuery文档:

http://docs.jquery。 com / Tutorials [ ^ ],

http://docs.jquery.com/Tutorials:How_jQuery_Works [ ^ ],

http://docs.jquery.com/Main_Page [ ^ ]。



-SA
I would advise to use CSS with jQuery. Please see:
http://api.jquery.com/category/css/[^],
http://api.jquery.com/addClass/[^],
http://api.jquery.com/removeClass/[^],
http://api.jquery.com/toggleClass/[^].

The idea is: you create two different styles for the same element, with different colors and switch from one to another using the methods .addClass(), .removeClass() or .toggleClass().

Please see the documentation with code samples I referenced above; see other CSS methods and see jQuery documentation if you need to learn about it:
http://docs.jquery.com/Tutorials[^],
http://docs.jquery.com/Tutorials:How_jQuery_Works[^],
http://docs.jquery.com/Main_Page[^].

—SA




查看此

< td runat =serverid =tdColor>



Hi ,
Check this
<td runat="server" id="tdColor">

protected void Page_Load(object sender, EventArgs e)
   {
       tdColor.Style.Add(HtmlTextWriterStyle.BackgroundColor, "Red");
   }







<table style="width: 100%;">
      <tr>
          <td runat="server" id="tdColor">
              &nbsp;
          </td>
          <td>
              &nbsp;
          </td>
          <td>
              &nbsp;
          </td>
      </tr>
      <tr>
          <td>
              &nbsp;
          </td>
          <td>
              &nbsp;
          </td>
          <td>
              &nbsp;
          </td>
      </tr>
      <tr>
          <td>
              &nbsp;
          </td>
          <td>
              &nbsp;
          </td>
          <td>
              &nbsp;
          </td>
      </tr>
  </table>





最好的问候

M.Mitwalli



Best Regards
M.Mitwalli


<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ricky's Solution</title>

    <!-- TO SET THE STYLES OF THE TABLE AND CELLS AS WELL -->
    <style type="text/css">
        .table1
        {
            width:500px; height:200px; text-align:center;
        }
        .cell
        {
            border:solid 1px #999;
        }
        .cell-1
        {
            border:solid 1px #999; background:#999; color:#FFF;
        }
    </style>


</head>
<body>
    <form id="form1" runat="server">
    <div align="center">

        <table class="table1">
            <tr>

                <td id="cell-1" class="cell" onclick="this.className='cell-1'">
                    1</td>

                <td id="cell-2" class="cell" onclick="this.className='cell-1'">
                    2</td>

                <td id="cell-3" class="cell" onclick="this.className='cell-1'">
                    3</td>
            </tr>
            <tr>

                <td id="cell-4" class="cell" onclick="this.className='cell-1'">
                    4</td>

                <td id="cell-5" class="cell" onclick="this.className='cell-1'">
                    5</td>

                <td id="cell-6" class="cell" onclick="this.className='cell-1'">
                    6</td>
            </tr>
            <tr>

                <td id="cell-7" class="cell" onclick="this.className='cell-1'">
                    7</td>

                <td id="cell-8" class="cell" onclick="this.className='cell-1'">
                    8</td>

                <td id="cell-9" class="cell" onclick="this.className='cell-1'">
                    9</td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>


这篇关于如何在运行时更改表中td的颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆