点击按钮后为我的表选择一个类?(HTML表)

本文关键字：一个 HTML 选择 按钮 我的 | 更新日期: 2023-09-27 17:51:05

我在css文件(StyleSheet1.css)中声明了两个类，. class1和. class2。我如何选择这两个类点击按钮后，我的表标记?

<link href="Styles/StyleSheet1.css" rel="stylesheet" type="text/css" />
<table class="Class1">
    <tr>
        <td>Hello World!</td>
    </tr>
</table>
CSS文件:

.Class1
{   
    background-color: Blue;
}
.Class2
{
    background-color: Red;
}

尽可能多的我想改变类使用c#如果可能的话，但如果不是，javascript也许?

我对ASP和c#非常陌生，对HTML有一点经验。

对

点击按钮后为我的表选择一个类?(HTML表)

可以使用Javascript和jQuery。请查看下面的代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $('#btn1').click(function () {
                $('#tbl1').toggleClass('Class2');
            });
        });
    </script>
    <style>
        .Class1
        {
            background-color: Blue;
        }
        .Class2
        {
            background-color: Red;
        }
    </style>
</head>
<body>
    <table class="Class1" id="tbl1">
    <tr>
        <td>Hello World!</td>
    </tr>
</table>
    <button id="btn1">change</button>
</body>
</html>

如果你正在使用asp.net webforms(不是MVC)，并希望这样做的服务器端，使表一个控件通过添加runat="server"和给它一个ID

<table class="Class1" id="myTable" runat="sever">
    <tr>
        <td>Hello World!</td>
    </tr>
</table>

现在，您可以在按钮单击事件(或页面生命周期的任何阶段)中使用表服务器端。您可以使用如下内容:

string cssClass = string.Empty;
if(/*What ever to determine to use class 1*/)
{
     cssClass = "Class1";
}
else
{
     cssClass = "Class2";
}
myTable.Attributes["class"] = cssClass;

你可以在一行中这样做:

myTable.Attributes["class"] = /*Condition to determin class 1*/ ? "Class1" : "Class2";
相关文章：