HtmlHelper让我们的效率更高

想了很久才想到这个标题.我们先来看一个简单的DEMO.
IDE:VS2010
mvc版本:3.0rc2
我们新建一个项目:

本文来自博客园Zilch-Wei
现在我们的需求是   添加一个链接 指向Home/About这个action链接为一张图片.这样图片存放在项目根目录/file/1.jpg.
这样我们会尝试使用<%=Html.ActionLink("http://www.cnblogs.com/file/1.jpg", "About") %>编译运行这个项目.如图:

2010122909393774.png

看来我们的html代码被Encode了没有被正确的执行到.当然我们可以用传统的方法来做这个事情.不过HtmlHelper可以帮我们解决这个问题.我们在根目录下新建一个文件夹HtmlHelpers

然后添加一个静态类MyHtmlHelper如图本文来自博客园Zilch-Wei

2010122909502588.png

我们编写一个扩展方法:

本文来自博客园Zilch-Wei

/// <summary>本文来自博客园Zilch-Wei

/// 显示图片链接
/// </summary>
/// <param name="name">鼠标指向时显示的文字,可以为Null</param>
/// <param name="url">点击图片显示的地址,如果为Null则不会跳转</param>
/// <param name="src">图片的路径,如果为Null则在view上看不到任何显示</param>
/// <returns></returns>
public static MvcHtmlString Link_Img(this HtmlHelper htmlhelper,string name,string url,string src)
{
TagBuilder titleContent
= new TagBuilder("a");//创建一个<a>的标签
titleContent.MergeAttribute("alt", name);//鼠标指向图片显示的字
titleContent.MergeAttribute("href", url);//点击转到的地址
TagBuilder imgContent = new TagBuilder("img");//创建一个<a>的标签
imgContent.MergeAttribute("src", src);//图片的路径
titleContent.InnerHtml = string.Format("{0}", imgContent.ToString());
return MvcHtmlString.Create(titleContent.ToString());

}

当然我们不止在一个地方使用这个扩展方法 所以我们在web.config的<namespaces>节点中添加<add namespace="MvcHtmlHelper.HtmlHelpers"/>

这样我们就可以在view用使用它了.使用中的效果如图:本文来自博客园Zilch-Wei

2010122909583538.png

我们运行结果:

2010122910004628.png

好了,我们的目的达到了,这样我们的图片地址可以直接通过数据库取出来做成链接,当然你也可以手动来配置他.

最后HtmlHelper很强大,多用于View层的一些扩展,我也在尝试把jq的一些插件直接扩展进去.

转载于:https://www.cnblogs.com/ZilchWei/archive/2010/12/29/Zilch-Wei.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值