使用复选框更改对象可见性？

Question

如果以前有人问过这个问题，但我找不到它，我真的很抱歉。

开发 ASP.NET/C# Web 应用程序。

我正在后面的代码中创建一个标签并将其添加到页面（所有代码都在后面的代码中编码，而不是在设计页面中）

现在我有一个复选框，我想根据是否选中该复选框来更改标签的可见性（显示）或如果没有（隐藏）。

我尝试使用更新面板。但由于标签是在代码中生成的，因此每次出现部分回发时我都必须再次生成它。我不想要这样。

有没有办法用 javascript 来避免回发？其他解决方案也受到赞赏。

非常感谢您的帮助

Answer 1

将此代码放入页面Load中。

if (!Page.IsPostBack) {
    Label lbl = new Label();
    lbl.ID = "lbl";
    lbl.Text = "Test";
    this.Controls.Add(lbl); 

添加对 jQuery javascript 的引用并将其作为 HTML 放置在下面。

<asp:CheckBox runat="server" ID="chk" />
<script language="javascript" type="text/javascript">
    $(document).ready(function () {
        $("#chk").change(function () {
            if (this.checked)
                $("#lbl").hide();
            else
                $("#lbl").show();
        });
    });
</script>

如果您需要创建动态控件，请尝试使用 AJAX (jQuery)。

Answer 2

你走在正确的轨道上。您可以通过使用客户端脚本来执行此操作，从而避免使用 UpdatePanel 控件和 AJAX 调用的开销和复杂性。

您需要定义一个 JavaScript 函数来触发网页上复选框的 onClick 事件：

<input type="checkbox" onclick="checkboxChanged(this);" />

我假设您正在从代码隐藏中向页面添加 ID 为“lbl”的标签。确保将标签设为 Page 类的 Protected 成员，以便您可以使用服务器标记从 aspx 页面访问它，以便在 JavaScript 中调用 document.getElementById 时检索正确的 ID。这很重要。

Partial Class MyPage
  Inherits System.Web.UI.Page
  Protected lbl As Label

  Private Sub Page_Load(sender As Object, e As EventArgs)

    If Not Page.IsPostback Then

      lbl = New Label()
      lbl.ID = "lbl"
      Me.Controls.Add(lbl)

    End If

  End Sub

End Class

因此，您的 aspx 页面上的 JavaScript 代码如下所示：

function checkboxChanged(checkbox) {
  if (checkbox.checked) {
    document.getElementById("<%=Me.lbl.ClientID %>").style.display = 'inline';
  } else {
    document.getElementById("<%=Me.lbl.ClientID %>").style.display = 'none';
  }
}

Answer 3

<asp:CheckBox ID="CheckBox1" onclick='$("span[id$=lblToHide]").toggle();' runat="server" Text="Bla" AutoPostBack="false" />   

if (!Page.IsPostBack) {
    Label lbl = new Label();
    lbl.ID = "lblToHide";       
    lbl.Text = "I am visible";
    lbl.Attributes.Add("style", "display:none"); //hide at first
    this.Controls.Add(lbl); //or however you are adding it
}

Answer 4

为什么不想在每次回发时加载标签控件？使用 ASP.NET，整个页面都会通过每次回发来加载，并且视图状态会重新加载到控件中。然后，您可以在页面初始化事件中每次创建标签控件，并且在这种情况下，它的 viewstate 可见属性将在回发之间保留。