超链接将下拉列表设置为可见

本文关键字：设置 下拉列表 超链接 | 更新日期: 2023-09-27 17:48:56

想知道是否有办法在单击超链接时将下拉列表设置为在代码隐藏或 asp 中可见？

<asp:HyperLink ID="HyperLink2" runat="server">View More Workout Programs »</asp:HyperLink>

超链接将下拉列表设置为可见

如果必须在代码隐藏中执行此操作，请使用LinkButton而不是HyperLink。 然后它将像任何按钮一样具有单击事件，在该单击事件中，您可以将其他元素设置为 .Visible=true .

但是，这是否需要在代码隐藏中完成？ 请记住服务器端和客户端代码之间"可见性"的差异：

  • 如果在服务器端设置为 .Visible=false，则内容根本不会传递到客户端。
  • 如果在客户端设置为display:none，则内容存在并且可以在页面源代码中查看，只是浏览器不显示它。

在某些情况下，出于安全目的需要前者。 但是，如果这只是用户体验的问题，那么我建议完全在客户端显示/隐藏内容，以避免仅更改元素显示属性的回发。

例如(假设 jQuery(：

<a id="toggler" href="#">Show the content</a>
<div id="hidden" style="display:none;">Content</div>
<script>
  $(document).ready(function(){
    $("#toggler").click(function(){
      $("#hidden").show();
    });
  });
</script>

使用asp:LinkButton而不是超链接并处理OnClick事件。 在OnClick事件中，根据是否要显示它来切换myDropDownList.Visible。

您应该在客户端(javascript代码(中实现这种功能以改善用户体验。

无论如何，您可以使用具有可见性=假的面板，并在单击链接时将可见性=真放在代码后面。 您需要使用 css 调整该面板的位置，使其看起来像一个下拉列表。

你可以试试JQuery：http://www.jquery.com

它将是这样的

<script type="text/javascript">
    $(document).ready(function(){
        $("#<% =HyperLink2.ClientID %>").click(function() {
            $("#<% =DropDownList1.ClientID %>").toggle();
        });
    });
</script>

如果需要将表单发送回服务器，请改用 asp：LinkButton 并在服务器端处理 OnClick 事件。如果您需要在客户端显示下拉列表，请使用带有 onclick 客户端事件的 javascript 函数来显示或隐藏您想要的任何部分。

相关文章：