如何通过单击 <a> ASP.net Web 表单的元素来附加哈希并启动回发？

Question

我想单击元素以将哈希值附加到url，然后启动回发，但我只能让其中一个发生。

单击带有onserverclick属性的元素会启动回发，但不会追加哈希值。

<a href="#message" class="anchorButton" onserverclick="BackwardsPost" id="subAnchor" runat="server">Submit</a>

单击没有onserverclick属性的元素会导致将哈希添加到url，但不会发生回发。

<a href="#message" class="anchorButton" id="subAnchor" runat="server">Submit</a>

我的目标是在用户单击元素时，通过使用CSS目标伪选择器显示另一个元素，并让相同的单击启动回发。我知道JavaScript是这个任务的合适工具，但它不是一个选项。

下面是我想在目标伪选择器中设置为可见的元素:

<p class="targetMessage" id="message">Insert text here.</p>

下面是我使用的CSS类:

.targetMessage {
    display: none;
}
.targetMessage:target {
        display: block;
        color: red;
}

我也考虑过使用html元元素来自动刷新页面，同时在会话状态中存储页面的状态;导致在用户单击时使用消息重新加载页面，然后在几秒钟后自动刷新以执行实际工作，但我宁愿不使用此选项。

感谢您的输入。谢谢你！

Answer 1

因为您希望使用的href似乎与ASP. net的方式相冲突。. NET在定义onserverclick时呈现控件，我建议使用一种不依赖于锚的href的替代方法。

如果您愿意在标记中移动消息，则可以将同级选择器与:focus伪类结合使用，以便在单击链接时显示消息:

.targetMessage {
  display: none;
}
.anchorButton:focus + .targetMessage {
  display: block;
  color: red;
}

<a href="#" class="anchorButton" id="subAnchor">Submit</a>
<p class="targetMessage" id="message">Insert text here.</p>

希望这对你有帮助!如果您有任何问题，请告诉我。