答案 0 :(得分：66)
来自Stephen Walthe，来自他的Contact manger project
public static class ImageActionLinkHelper
{
public static string ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, object routeValues, AjaxOptions ajaxOptions)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName, routeValues, ajaxOptions);
return link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing));
}
}
您现在可以输入您的aspx文件：
<%= Ajax.ImageActionLink("../../Content/Delete.png", "Delete", "Delete", new { id = item.Id }, new AjaxOptions { Confirm = "Delete contact?", HttpMethod = "Delete", UpdateTargetId = "divContactList" })%>
答案 1 :(得分：35)
这是我找到的最简单的解决方案：
<%= Ajax.ActionLink("[replacethis]", ...).Replace("[replacethis]", "<img src=\"/images/test.gif\" ... />" %>
Replace（）调用用于将 img 标记推送到操作链接中。您只需要使用“[replaceme]”文本（或任何其他安全文本）作为临时占位符来创建链接。
答案 2 :(得分：30)
这是对Black Horus回答的Razor / MVC 3（及更高版本）更新：
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;
public static class ImageActionLinkHelper
{
public static IHtmlString ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, object routeValues, AjaxOptions ajaxOptions, object htmlAttributes = null)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
builder.MergeAttributes(new RouteValueDictionary(htmlAttributes));
var link = helper.ActionLink("[replaceme]", actionName, routeValues, ajaxOptions).ToHtmlString();
return MvcHtmlString.Create(link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
}
您现在可以输入.cshtml文件：
@Ajax.ImageActionLink("../../Content/Delete.png", "Delete", "Delete", new { id = item.Id }, new AjaxOptions { Confirm = "Delete contact?", HttpMethod = "Delete", UpdateTargetId = "divContactList" })
2013年10月31日：更新了一个额外的参数，以允许为图像元素设置其他HTML属性。用法：的
@Ajax.ImageActionLink("../../Content/Delete.png", "Delete", "Delete", new { id = item.Id }, new AjaxOptions { Confirm = "Delete contact?", HttpMethod = "Delete", UpdateTargetId = "divContactList" }, new{ style="border: none;" })
答案 3 :(得分：6)
另一种解决方案是创建自己的扩展方法：
ActionLink<TController>(this HtmlHelper helper, Expression<Action<TController>> action, string linkText, object htmlAttributes, LinkOptions options)
，最后一个参数是枚举LinkOptions
[Flags]
public enum LinkOptions
{
PlainContent = 0,
EncodeContent = 1,
}
然后您可以按如下方式使用它：
Html.ActionLink<Car>(
c => c.Delete(item.ID), "<span class=\"redC\">X</span>",
new { Class = "none left" },
LinkOptions.PlainContent)
我会在我的博客上发布此解决方案的完整描述：http://fknet.wordpress.com/
答案 4 :(得分：5)
简短的回答是不可能的。你可以选择编写自己的扩展方法来拥有一个ImageActionLink，而不是很难做到。或者向actionLink添加一个属性，并将innerhtml替换为image标签。
答案 5 :(得分：5)
请参阅版本7 http://asp.net/mvc上的联系人管理器教程。 Stephen Walther有一个创建Ajax.ActionLink的例子，它是一个图像。
答案 6 :(得分：4)
MVC3，Html.ActionImageLink和Ajax.ActionImageLink
感谢所有其他答案，帮助我解决这些问题。
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string imageUrl, string altText, string actionName, string controller, object routeValues)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName, controller, routeValues);
return new MvcHtmlString(link.ToHtmlString().Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
public static MvcHtmlString ActionImageLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, string controller, object routeValues, AjaxOptions ajaxOptions)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName, controller, routeValues, ajaxOptions);
return new MvcHtmlString(link.ToHtmlString().Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
答案 7 :(得分：4)
使用Razor模板委托有一个更好的解决方案，它允许以非常自然的方式在动作链接中插入任何Razor代码。因此，您可以添加图像或任何其他代码。
这是扩展方法：
public static IHtmlString ActionLink<T>(this AjaxHelper ajaxHelper,
T item, Func<T,HelperResult> template, string action,
string controller, object routeValues, AjaxOptions options)
{
string rawContent = template(item).ToHtmlString();
MvcHtmlString a = ajaxHelper.ActionLink("$$$", action,
controller, routeValues, options);
return MvcHtmlString.Create(a.ToString().Replace("$$$", rawContent));
}
这就是它的使用方法：
@Ajax.ActionLink(car,
@<div>
<h1>@car.Maker</h1>
<p>@car.Description</p>
<p>Price: @string.Format("{0:C}",car.Price)</p>
</div>, ...
这允许使用intellisense编写Razor，并使用您想要的任何对象模板（ViewModel或任何其他对象，如我的示例中的汽车）。您可以使用模板中的任何帮助程序来嵌套图像或您想要的任何元素。
Resharper用户注意事项
如果您在项目中使用R＃，可以添加R# annotations以改善智能感知：
public static IHtmlString ActionLink<T>(this AjaxHelper ajaxHelper, T item,
Func<T, HelperResult> template,
[AspMvcAction] string action, [AspMvcController] string controller,
object routeValues, AjaxOptions options)
答案 8 :(得分：2)
每个答案都很好，但我找到了最简单的答案：
@Html.ActionLink( " ", "Index", "Countries", null, new
{
style = "background: url('../../Content/Images/icon.png') no-repeat center right;display:block; height:24px; width:24px;margin-top:-2px;text-decoration:none;"
} )
请注意，它使用空格（“”）作为链接文本。它不适用于空文本。
答案 9 :(得分：0)
第一个解决方案是使用辅助静态方法 DecodeLinkContent ，如下所示：
DecodeLinkContent(Html.ActionLink<Home>(c => c.Delete(item.ID), "<span class=\"redC\">X</span>",new { Class = "none left"}))
DecodeLinkContent必须首先找到'＆gt;'最后'＆lt;'并且必须用HttpUtility.Decode（内容）替换内容。
这个解决方案有点像黑客，但我认为这是最容易的。
答案 10 :(得分：0)
我不知道，这对我来说似乎更容易：
<a href="@Url.Action("index", "home")">
<img src="~/Images/rocket.png" width="25" height="25" title="Launcher" />
</a>
答案 11 :(得分：0)
其他人对我不起作用，因为.ToHtmlString（）在MVC 4中吐出一个字符串。
下面将id传递给编辑控件并显示编辑图像而不是文本spag：
@MvcHtmlString.Create(Ajax.ActionLink("Spag", "Edit", new { id = item.x0101EmployeeID }, new AjaxOptions() { UpdateTargetId = "selectDiv", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }).ToHtmlString().Replace("Spag", "<img src=\"" + Url.Content("../../Images/edit.png") + "\" />"))
答案 12 :(得分：0)
使用Html数据属性
<a data-ajax="true" data-ajax-begin="..." data-ajax-success="..." href="@Url.Action("Delete")">
<i class="halflings-icon remove"></i>
</a>
替换
<i class="halflings-icon remove"></i>
使用您自己的图像
答案 13 :(得分：0)
使用此扩展程序与glifyphicon生成ajax链接：
/// <summary>
/// Create an Ajax.ActionLink with an associated glyphicon
/// </summary>
/// <param name="ajaxHelper"></param>
/// <param name="linkText"></param>
/// <param name="actionName"></param>
/// <param name="controllerName"></param>
/// <param name="glyphicon"></param>
/// <param name="ajaxOptions"></param>
/// <param name="routeValues"></param>
/// <param name="htmlAttributes"></param>
/// <returns></returns>
public static MvcHtmlString ImageActionLink(this AjaxHelper ajaxHelper, string linkText, string actionName, string controllerName, string glyphicon, AjaxOptions ajaxOptions, RouteValueDictionary routeValues = null, object htmlAttributes = null)
{
//Example of result:
//<a id="btnShow" href="/Customers/ShowArtworks?customerId=1" data-ajax-update="#pnlArtworks" data-ajax-success="jsSuccess"
//data-ajax-mode="replace" data-ajax-method="POST" data-ajax-failure="jsFailure" data-ajax-confirm="confirm" data-ajax-complete="jsComplete"
//data-ajax-begin="jsBegin" data-ajax="true">
// <i class="glyphicon glyphicon-pencil"></i>
// <span>Edit</span>
//</a>
var builderI = new TagBuilder("i");
builderI.MergeAttribute("class", "glyphicon " + glyphicon);
string iTag = builderI.ToString(TagRenderMode.Normal);
string spanTag = "";
if (!string.IsNullOrEmpty(linkText))
{
var builderSpan = new TagBuilder("span") { InnerHtml = " " + linkText };
spanTag = builderSpan.ToString(TagRenderMode.Normal);
}
//Create the "a" tag that wraps
var builderA = new TagBuilder("a");
var requestContext = HttpContext.Current.Request.RequestContext;
var uh = new UrlHelper(requestContext);
builderA.MergeAttribute("href", uh.Action(actionName, controllerName, routeValues));
builderA.MergeAttributes(HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));
builderA.MergeAttributes((ajaxOptions).ToUnobtrusiveHtmlAttributes());
builderA.InnerHtml = iTag + spanTag;
return new MvcHtmlString(builderA.ToString(TagRenderMode.Normal));
}
答案 14 :(得分：0)
我发现，对此最好的解决方案是使用type =＆＃34; image＆＃34;
的输入标签@using (Ajax.BeginForm( "LoadTest","Home" , new System.Web.Mvc.Ajax.AjaxOptions { UpdateTargetId = "[insert your target tag's id here]" }))
{
<input type="image" class="[css style class here]" src="[insert image link here]">
}
它很简单，速度很快。
我已经将它与其他干扰AjaxOptions的控件库结合使用，因此我倾向于输入整个System.Web.Mvc.Ajax.AjaxOptions，以防万一我最终尝试了一个不同的集合。将来
注意： 我注意到这似乎在MVC3中存在问题（与type =＆＃34; image＆＃34;有关），但它确实适用于MVC 4
答案 15 :(得分：0)
所有这些都是非常好的解决方案，但如果您不喜欢在解决方案中使用replace，可以试试这个：
{
var url = new UrlHelper(helper.ViewContext.RequestContext);
// build the <img> tag
var imgBuilder = new TagBuilder("img");
imgBuilder.MergeAttribute("src", url.Content(imageUrl));
imgBuilder.MergeAttribute("alt", altText);
string imgHtml = imgBuilder.ToString(TagRenderMode.SelfClosing);
//build the <a> tag
var anchorBuilder = new TagBuilder("a");
anchorBuilder.MergeAttribute("href", url.Action(actionName, controller, routeValues));
anchorBuilder.InnerHtml = imgHtml; // include the <img> tag inside
anchorBuilder.MergeAttributes<string, object>(ajaxOptions.ToUnobtrusiveHtmlAttributes());
string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal);
return MvcHtmlString.Create(anchorHtml);
}
此外，就我而言，如果我不使用url.Content(imageUrl)，则图片无法显示。
答案 16 :(得分：0)
这里有很好的解决方案，但是如果你想在动作链接中拥有更多的图像呢？我就是这样做的：
@using (Ajax.BeginForm("Action", "Controler", ajaxOptions))
{
<button type="submit">
<img src="image.png" />
</button>
}
缺点是我仍然需要在button-element上做一些样式，但是你可以把你想要的所有html放在那里。
答案 17 :(得分：0)
试试这个
@Html.Raw(HttpUtility.HtmlDecode(Ajax.ActionLink( "<img src=\"/images/sjt.jpg\" title=\"上一月\" border=\"0\" alt=\"上一月\" />", "CalendarPartial", new { strThisDate = Model.dtCurrentDate.AddMonths(-1).ToString("yyyy-MM-dd") }, new AjaxOptions { @UpdateTargetId = "calendar" }).ToString()))
答案 18 :(得分：0)
.li_inbox {background：url（inbox.png）no-repeat;填充左：40像素; / 图像背景可能是40px /}
<li class="li_inbox" >
@Ajax.ActionLink("Inbox", "inbox","Home", new { },
new AjaxOptions
{
UpdateTargetId = "MainContent",
InsertionMode = InsertionMode.Replace,
HttpMethod = "GET"
})
答案 19 :(得分：0)
使用Templated Razor Delegates更新MVC3依赖T4Mvc，但却带来了很大的威力。
根据此页面上的其他各种答案。
public static HelperResult WrapInActionLink(this AjaxHelper helper,ActionResult result, Func<object,HelperResult> template,AjaxOptions options)
{
var link=helper.ActionLink("[replaceme]",result,options);
var asString=link.ToString();
var replaced=asString.Replace("[replaceme]",template(null).ToString());
return new HelperResult(writer =>
{
writer.Write(replaced);
});
}
允许：
@Ajax.WrapInActionLink(MVC.Deal.Details(deal.ID.Value),@<img alt='Edit deal details' src='@Links.Content.Images.edit_16_gif'/>, new AjaxOptions() { UpdateTargetId="indexDetails" })
答案 20 :(得分：-1)
actionName+"/"+routeValues Proje/ControlName/ActionName/Id
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;
namespace MithatCanMvc.AjaxHelpers
{
public static class ImageActionLinkHelper
{
public static IHtmlString ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, string routeValues, AjaxOptions ajaxOptions)
{
var builder = new TagBuilder("img");
builder.MergeAttribute("src", imageUrl);
builder.MergeAttribute("alt", altText);
var link = helper.ActionLink("[replaceme]", actionName+"/"+routeValues, ajaxOptions).ToHtmlString();
return MvcHtmlString.Create(link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing)));
}
}
}