Html.ActionLink作为按钮或图像，而不是链接

在ASP.NET MVC的最新版本（RC1）中，如何将Html.ActionLink呈现为按钮或图像而不是链接？

#1楼

我这样做的方法是单独使用actionLink和图像。将actionlink图像设置为隐藏，然后添加jQuery触发器调用。这更像是一种解决方法。

'<%= Html.ActionLink("Button Name", "Index", null, new { @class="yourclassname" }) %>'
<img id="yourImage" src="myImage.jpg" />

触发示例：

$("#yourImage").click(function () {
  $('.yourclassname').trigger('click');
});

#2楼

借用Patrick的回答，我发现我必须这样做：

<button onclick="location.href='@Url.Action("Index", "Users")';return false;">Cancel</button>

避免调用表单的post方法。

#3楼

似乎有很多关于如何创建显示为图像的链接的解决方案，但没有一个使它看起来像是一个按钮。

我发现只有很好的方法才能做到这一点。它有点hacky，但它的工作原理。

您需要做的是创建一个按钮和一个单独的操作链接。使用css使操作链接不可见。单击该按钮时，它可以触发操作链接的单击事件。

<input type="button" value="Search" onclick="Search()" />
 @Ajax.ActionLink("Search", "ActionName", null, new AjaxOptions {}, new { id = "SearchLink", style="display:none;" })

function Search(){
    $("#SearchLink").click();
 }

每次添加需要看起来像按钮的链接时，执行此操作可能会很痛苦，但它确实可以实现所需的结果。

#4楼

一个迟到的答案，但这就是我将ActionLink变成按钮的方式。我们在项目中使用Bootstrap，因为它很方便。没关系@T，因为它只是我们正在使用的翻译器。

@Html.Actionlink("Some_button_text", "ActionMethod", "Controller", "Optional parameter", "html_code_you_want_to_apply_to_the_actionlink");

上面给出了这样的链接，如下图所示：

localhost:XXXXX/Firms/AddAffiliation/F0500

在我看来：

@using (Html.BeginForm())
{
<div class="section-header">
    <div class="title">
        @T("Admin.Users.Users")
    </div>
    <div class="addAffiliation">
        <p />
        @Html.ActionLink("" + @T("Admin.Users.AddAffiliation"), "AddAffiliation", "Firms", new { id = (string)@WorkContext.CurrentFirm.ExternalId }, new { @class="btn btn-primary" })
    </div>
</div>

}

希望这有助于某人

#5楼

如果您不想使用链接，请使用按钮。你也可以添加图像到按钮：

<button type="button" onclick="location.href='@Url.Action("Create", "Company")'" >
   Create New
   <img alt="New" title="New" src="~/Images/Button/plus.png">
</button>

type =“button”执行您的操作，而不是提交表单。

来源：oschina

链接：https://my.oschina.net/u/3797416/blog/3197426

标签

Bootstrap

jquery

ASP.NET MVC