如何在 asp.net 页面上获取元素的样式答案

【问题标题】：How do you get the style of an element on an asp.net page如何在 asp.net 页面上获取元素的样式
【发布时间】：2011-09-26 03:39:41
【问题描述】：

我有一个带有手风琴 javascript 的管理页面来显示/隐藏 div。

<div class="accordion">
    <h2>Pending</h2>
    <div id="pending" class="accordion-item">PARTIALVIEW</div>
    <h2>Current</h2>
    <div id="current" class="accordion-item">PARTIALVIEW</div>
    <h2>All</h2>
    <div id="all" class="accordion-item">PARTIALVIEW</div>
</div>

当他们删除一个项目时，页面会刷新，然后他们又回到折叠状态。我想让它记住哪些是打开的，哪些是关闭的。

手风琴 javascript 给出了 div style="display: none" 或 style="display: block"

有没有办法在页面重新加载之前获取样式并在再次加载后应用它？

【问题讨论】：

这将需要 javascript。您可能需要添加该标签。
您需要支持哪个版本的IE（如果有的话）？

标签： c# javascript asp.net css asp.net-mvc

【解决方案1】：

如果您想在页面上积极查看样式和更改，我建议您使用 Firebug（FireFox 插件）。

关于保存状态，有两种方法。第一种是 AJAX 方法。第二种是仅 JS，基于 cookie 的方法。

对于 AJAX 方法，您需要编写一个 JS 函数，该函数会在状态更改时触发。然后，此方法通过快速的幕后查询将所有可折叠选项的状态发送到服务器。然后服务器将此信息保存到会话变量中。然后当页面重新加载时，服务器可以为页面上的每个项目植入一个包含最后已知状态信息的 JS 数组。

对于第二种方法，您必须设置一个 cookie，该 cookie 包含一个包含所有项目状态的变量。这可以是一个简单的数组。这与 AJAX 方法的工作方式相同，只是数据保存在客户端浏览器而不是服务器上。您从 cookie 数组而不是服务器数组获取状态。

对于其中任何一个，我建议使用 JQuery 库。对于 cookie 方法，我建议使用 JQuery 的 Cookie 插件（http://plugins.jquery.com/project/Cookie）。这是一篇关于此的快速指南文章：http://jquery-howto.blogspot.com/2010/09/jquery-cookies-getsetdelete-plugin.html

JQuery - http://jquery.com/
jQuery UI - http://jqueryui.com/
Visual JQuery（一个伟大的、易于使用的 JQuery 参考）-http://visualjquery.com/
萤火虫 - http://getfirebug.com/
Firefox -（没有它就不要离开家）http://www.mozilla.com/en-US/firefox/fx/

【讨论】：

【解决方案2】：

为了实现这一点，我将处理手风琴的change 事件并将更新的值存储在 html5 本地存储或 cookie 中。加载页面时，只需检查保存的值是否存在并恢复手风琴的状态。

如果您使用 jqueryui 的手风琴，create 和 change 事件应该可以满足您的需求。

【讨论】：

【解决方案3】：

对不起，我没有看到 mvc 标签。

您必须使用 javascript 和 cookie 执行此操作，以尽量减少对用户体验的影响（html5 存储会带来提示）。

【讨论】：

【解决方案4】：

ASP.NET AJAX 框架使用隐藏字段来实现这一点；虽然您可能不会使用它，但隐藏有很多优点。它们可以存储任何类型的数据并在服务器上序列化，它们可以回传到服务器，并且可以通过匹配名称由action方法处理。

HTH。

【讨论】：

【解决方案5】：

您可以很好地将当前显示在隐藏字段中的 div 的 ID 存储起来。当然，这需要一点 Javascript，但如果文件是 runat="server"，您应该能够在服务器端轻松访问它。根据该值，您可以执行隐藏/显示逻辑。

IMO，隐藏字段仍然是客户端与服务器共享其状态的最简单方式。

【讨论】：