Question

我有以下简单的aspx代码：

WebForm1.aspx的

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

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function myFunction() {
            document.getElementById("Label1").className = "clientAssignedClass";
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <asp:Label runat="server" Text="Label" ID="Label1"></asp:Label>
                    <asp:Button ID="Button1" runat="server" Text="Update" />
                    <asp:Button ID="Button2" runat="server" Text="Change at server" OnClick="Button2_Click" />
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                <ContentTemplate>
                    <asp:Button ID="Button3" runat="server" Text="Change at client" OnClientClick="myFunction()" />
                </ContentTemplate>
            </asp:UpdatePanel>

        </div>
    </form>
</body>
</html>

使用以下cs代码：

WebForm1.aspx.cs中

using System;

namespace WebApplication3
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void Button2_Click(object sender, EventArgs e)
        {
            Label1.CssClass = "serverAssignedClass";
        }
    }
}

当我点击Change at server (Button2)按钮然后点击Update按钮时，类别属性会在回发中保留，但是当我点击Change at client (Button3)然后点击Update按钮时，类属性不会在回发之间保留（在Update回发之后，客户端所做的任何更改都会丢失）。

如何在回发中维护客户端所做的更改（例如Bootstrap所做的类更改，即active）？

Answer 1

好吧，我想它正在做它的设计目标。页面上的视图状态将插入名为__VIEWSTATE的隐藏字段中。在服务器端，它无法在客户端进行更改。它是一种在服务器上传送来回信息的机制。有关更详细的介绍，请查看this文章。

在客户端采用css类设置的最佳选择是将其放入hidden field之类的字段中，以便将其发回服务器。

Answer 2

ViewState用于将页面状态及其控件存储为服务器上的，以便在回发之间保留状态。它没有＆＃34;知道＆＃34;关于对客户端页面所做的更改。

ASP.NET webforms希望以其方式管理页面的状态 - 一切都在服务器上完成，页面状态的更改存储在ViewState中。

如果你已经习惯了更多的客户端代码，那就更常见了，那么因为这样的原因，使用webforms会有点令人沮丧。您尝试在客户端上维护页面状态，但页面包含回发到服务器的服务器控件。然后服务器重新呈现页面，破坏该客户端状态，因为它只知道它维护的状态。

如果可能的话，如果你不尝试混合两种，你的生活会更容易。如果您在现有的webforms项目上工作，请尝试在服务器上执行所有操作。如果您要创建新内容并且想要在客户端上管理状态，请避免使用服务器控件。只需使用ASP.NET作为引擎来呈现初始视图。

如果你真的真的想要这样做，你可以在cookie或本地存储中存储值，并在页面加载时检查这些值，看看你是否需要在页面加载时恢复一些CSS类。您甚至可以做一些非常奇怪的事情，例如将详细信息放入隐藏输入中，然后在服务器端以某种方式反映回来，以便在页面重新加载时，客户端脚本知道要（重新）设置的状态。

Viewstate不会保留客户端更改

2 个答案: