【ASP.NET】Html扩展方法总结，生成HTML代码，自定义扩展方法

关于链接的写法

HTML的写法

<a href="~/Test/Index">主页</a>

ASP.NET的写法

@Html.ActionLink("主页", "Index","Test") 

其中Test时Controller的名称，Index时视图的名称，主页为显示的文本

 

为链接添加路由参数和HTML特性

Html.ActionLink("主页", "Index","Test",new { name = "aaa",pwd ="123"},new { style = "color:red",id = 22 ,@class = "AA"})

生成的HTML代码

<a class="AA" href="/Test?name=aaa&amp;pwd=123" id="22" style="color:red">主页</a> 

点击链接，链接是

http://localhost:59584/Test?name=aaa&pwd=123

 

Html类还能生成控件

比如TextBox，CheckBox，RadioButton等等

输入框TextBox

@Html.TextBox("tbName")

获取后台数据

在字典中设置数据，只要key与TextBox的名称相同，即可

public ActionResult Index()
{
    ViewData["tbName"] = "哈哈";

    return View();
}

HTML代码

<input id="tbName" name="tbName" type="text" value="哈哈" />

效果

 

下拉框select

@Html.DropDownList("Students")

后台数据

ViewData["Students"] = new List<SelectListItem>()
{
    new SelectListItem(){Selected =true,Text="哈哈",Value = "1" },
    new SelectListItem(){Selected =false,Text="呵呵",Value = "2" },
    new SelectListItem(){Selected =false,Text="啊啊",Value = "3" },
};

HTML代码

<select id="Students" name="Students">
    <option selected="selected" value="1">哈哈</option>
    <option value="2">呵呵</option>
    <option value="3">啊啊</option>
</select>

效果

名称必须与ViewData的key相同，不然直接报错

也可以直接这么写

@Html.DropDownList("Students", new List<SelectListItem>()
            {
                new SelectListItem(){Selected =true,Text="哈哈",Value = "1" },
                new SelectListItem(){Selected =false,Text="呵呵",Value = "2" },
                new SelectListItem(){Selected =false,Text="啊啊",Value = "3" },
            },new { style = "color:red", id = 22, @class = "AA" })

 

 

自定义Html扩展方法

模仿系统自带的扩展方法

自定义Html扩展方法

namespace Extensions
{
    public static class MyHttpHelper
    {
        public static MvcHtmlString MyLabel(this HtmlHelper helper, string name)
        {
            return MvcHtmlString.Create(string.Format("<span>{0}</span>", name));
        }
    }
}

记得在页面引入命名空间

@using Web_MVC_4_5.Models

其实也可以将命名空间改为HtmlHelper的命名空间System.Web.Mvc

使用

@Html.MyLabel("label")

 

效果