是否可以用 HTML 元素替换 asp:button

Posted 2023-03-05

【中文标题】是否可以用 HTML 元素替换 asp:button

【英文标题】：Is it possible to replace an asp:button with a HTML element

【发布时间】：2012-01-04 20:28:55

【问题描述】：

我正在使用 asp 表单，想知道是否可以将标准按钮替换为使用 CSS 设置样式的 html 元素。

我的登录页面使用标准按钮

<asp:Button ID="LoginButton" runat="server" Text="Login" 
    onclick="LoginButton_Click" />

链接到执行登录检查的代码 (C#)。

我看到一些不错的按钮使用 HTML <button> 元素实现并使用 CSS 进行样式设置，这些按钮可以具有图像和翻转突出显示等功能。基本的 HTML 如下所示

<button type="submit" class="positive" onclick ="...">
    <img src="/icons/tick.png" /> 
    Login
</button>

我看到另一个讨论 Difference between asp:button and html's button 的问题，所以我知道 <button> 元素不是直接替换，但我想知道 asp:button 是否可以替换并仍然调用 @987654329 @C#代码背后？

编辑： 虽然我使用的是 ASP，但我不介意在必要时使用一些客户端 javascript。

我看到的让我思考这个问题的按钮在这里找到：Rediscovering the Button Element

编辑 2： 我使用LinkButton asp 控件尝试了answer from XIII，并且效果很好，按照我的意愿呈现按钮并在单击时激活C#

<asp:LinkButton ID="LoginBtn" CssClass="button positive"
        OnClick="LoginButton_Click" runat="server">
    <img src="/icons/tick.png" /> 
    Login
</asp:LinkButton>

Javascript 被插入到页面中（正如 Curt 所提到的），这对我来说不是问题，但可能对其他人来说；但由于 asp:loginview 和其他与表单身份验证相关的控件已经需要 javascript，我不确定这是解决方案的问题。

我决定接受 jwiscarson 的回答，因为这是一个更简洁的实现，尽管我认为，<button> 可以替代<asp:button>

【参考方案1】：

你的问题的答案：

如果可以替换 asp:button 并且仍然调用 LoginButton_Click 后面的 C# 代码？

是的。如果你有这样的按钮：

<button type="submit" id="submit" class="positive" runat="server">Submit</button>

你需要设置的属性是不是onclick，而是onserverclick。您还可以执行以下操作：

protected override OnInit(EventArgs e)

    submit.ServerClick += new EventHandler(submit_ServerClick);

如果您需要对该按钮进行样式设置，我认为解决此问题的最佳方法是通过您在示例中使用的 CSS 类。

【参考方案2】：

另一种方法是使用完全使用 CSS 的 LinkBut​​ton 控件和样式。我们过去曾经为某个项目这样做。对我们的客户来说效果非常好。

感兴趣的属性如果CssClass

【讨论】：

唯一的问题是 LinkBut​​tons 在没有 javascript 的情况下无法工作。 OP 没有指定这一点，但值得考虑。

@Curt - 我不介意使用 javascript，我主要对实现漂亮的按钮感兴趣。

【参考方案3】：

您可以通过<asp:Button/> 的cssClass 属性设置CSS 类。但是您可以将runat="server" 和onserverclick="LoginButton_Click" 属性设置为<button/>。

【讨论】：

<input type="button" /> 的样式选项非常有限。

【参考方案4】：

如果需要，您可以使用 HTML 按钮，并学习如何使用正确的参数调用 __doPostBack() 方法。 Asp.Net 按钮和 HTML 按钮在客户端中的呈现方式几乎相同。

【参考方案5】：

正如已经在此处发布的那样，您可以设置由asp:button 呈现的 HTML 样式或使用其他 asp 控件。您的asp:button 将呈现为<input type="submit">，其CSS 选项可能比<button> 标记更有限。

通过一些谷歌搜索，我认为可以渲染一个 <button> 标签，但它看起来像一个不平凡的练习，请参阅 How can I use the button tag with ASP.NET?

【讨论】：

有趣的链接，在发布我的问题之前我对 SO 的所有搜索，我都没有找到那个！谢谢，我去看看。