Question

这是webform1代码。我想在按钮点击后更改按钮类我点击按钮点击javascript函数...

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="valid_try2.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script type="text/javascript" src="JavaScript1.js"></script>
      <link rel="stylesheet" href="StyleSheet1.css"/>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

    <button id="btn" class="xx" name="btn" onclick="abc()">Button</button>
    </div>
    </form>
</body>
</html>

这是样式表文件，我创建了类

.xx {
    border: 5px solid green;    
}

.yy {
    border: 5px solid red;    
}

这是javascript文件

function abc() {
    $("#btn").removeClass("xx");
    $("#btn").addClass("yy");
}

Answer 1

您的按钮会触发表单帖子（PostBack），因此您使用abc()执行的所有操作都将丢失。

但由于你的标签是asp.net，你可以这样做：

<asp:Button ID="Button1" runat="server" Text="Button" CssClass="xx" OnClick="Button1_Click" />

然后在代码背后：

    protected void Button1_Click(object sender, EventArgs e)
    {
        //change the class and do other stuff after the button click
        Button1.CssClass = "yy";
    }

如果您错误地标记了您的问题并且想要一个纯粹的javascipt / css解决方案，请在按钮中添加type="button"，不会执行任何表单发布。

Answer 2

请尝试以下代码剪切希望它会有所帮助。

#include <iostream>
#include <bitset>

using namespace std;

typedef bitset<200> mybitset; // Or some other number

mybitset convert(const char *s)
{
    mybitset result;
    for (int loop = 0; s[loop]; ++loop) {
        if (s[loop] == '1') result[loop] = true;
    }
    return result;
}

int main() {
    mybitset num_1 =    convert(   "100101011101010100001");
    mybitset num_2 =    convert("110010100001001010100011");

    mybitset result = num_1 & num_2;

    cout << num_1.to_string() << endl;
    cout << num_2.to_string() << endl;
    cout << result.to_string() << endl;

    // your code goes here
    return 0;
}

Answer 3

一切看起来都不错。只需添加对aspx文件的JQuery引用。

在添加以下行之前。

<script src="https://code.jquery.com/jquery-latest.min.js"></script>

Answer 4

我认为你需要这样的东西

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <script src="../js/jquery.js" type="text/javascript"></script>

    <title></title>
    <style>
        .xx {
    border: 5px solid green;    
}

.yy {
    border: 5px solid red;    
}
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>

    <button id="btn" class="xx" name="btn">Button</button>
    </div>
    </form>
    <script>
        $(function() {
            $('#btn').click(function(e) {
                e.preventDefault();
                var a = $(this).attr('class');
                console.log(a);
                if (a === 'xx') {
                    $(this).removeAttr('class');
                    $(this).addClass("yy");
                } else {
                    $(this).removeAttr('class');
                    $(this).addClass("xx");
                }

            });
        })
    </script>
</body>
</html>

按钮点击后如何更改班级

4 个答案: