在客户端设置 asp 面板的显示 none 会在任何 linkBut​​tonclick 上重新显示它

Question

我遇到了 asp 面板可见性的奇怪问题。我有一个小表格，其中包含一个面板内的按钮，使 div 可见。

<div id="myModal" class="modal" style="display: none">
 <span onclick="CloseMyDiv();" id="closeSpan" class="close">×</span>
    <!-- Modal content --> 
</div>

<asp:Panel ID="pnlHasPriorApproval" runat="server" Style="display: none">
   <input onclick="ShowModal();" type="button" value="Extract" runat="server" />
</asp:Panel>

以下是 javascript 函数：

function ShowModal() {
    $('#myModal').show();
 }

 function CloseMyDiv() {
            var modal = document.getElementById('myModal'); // this is my div
            var pnlHasPriorApproval = document.getElementById('<%=  pnlHasPriorApproval.ClientID %>');  // this is my pannel
pnlHasPriorApproval.style.display = "none"; // hiding pannel
modal.style.display = "none"; // hiding div
}

过程是：每当我单击此按钮时，都会显示 div，而每当我单击关闭时，div 和面板都应该被隐藏...这非常有效。但是：每当我单击它时，我都会有另一个按钮，面板会再次显示，而它应该保持隐藏状态。

此按钮由服务器端的函数处理：

Protected Sub lnkBtnphyCode_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles lnkBtnphyCode.Click
....
End Sub

我确信服务器端没有任何东西改变我的面板在这个函数中的可见性，在加载页面事件中也没有。无论如何，我已经在一个 div 中使用新 ID "testDiv" 实现了我的面板，以确保它不会在其他任何地方使用，并且我已经完成了相同的过程（过程是隐藏这个 div onclick) 并且每当我点击 lnkBtnphyCode 时它仍然出现。

尝试过的解决方案：

1. 我通过设置 visibility:hidden 而不是使用显示来尝试相同的过程...但我遇到了同样的问题

2. 我在我的 lnkBtnphyCode_Click 方法中添加了 Dim v = Me.pnlHasPriorApproval.Visible，v 返回 true 这很奇怪，因为我已经将它隐藏起来，正如您在开头看到的那样。

3. 让它始终隐藏并且不在单击时显示的唯一方法是更改​​服务器端的可见性，我不明白为什么它并不总是对 javascript 隐藏(客户).

我的问题是：如何让它始终对 Javascript 隐藏？

Answer 1

JavaScript代码在客户端执行，ASP.Net在服务器端执行。除非 JS 代码与服务器共享当前状态信息，否则您的 ASP.Net 代码将不知道 JS 代码所做的更改。

当您点击按钮时，只有表单数据被提交到服务器。因此 div 和面板现在被隐藏的信息不会被传递（这是正常行为）。如果您想将它传递到服务器，您需要使用一些隐藏的表单字段显式发送此信息。

您可以做的是：

1. 在页面上创建一个隐藏控件，比如说isPanelVisible。
2. 隐藏div/面板时，使用JS代码在隐藏控件中设置一个true。
3. 在服务器端代码中 Page_Load，检查此隐藏控件的值并相应地设置面板的可见性。

这是处理此类案件的典型方式。