1)在VS中创建ASP.NET MVC 4 Web Application,在Project Template中选择Web API。
首先在Views\Home\中添加Add.aspx和Index.aspx
接下来我们将看的是系统默认首页Index.aspx和从Index.aspx跳转到Add.aspx
要看系统默认首页我们得看文件App_Start\RouteConfig.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;
namespace MvcApplication15
{
public class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
}
}
}
从这段代码中我相信有代码基础的你不难看出来系统启动后默认调用是controller = "Home", action = "Index",
那我们就来看看Controllers\HomeController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MvcApplication15.Controllers
{
public class HomeController : Controller
{
//对应Views\Home\Index.aspx
public ActionResult Index()
{
return View();
}
//对应Views\Home\Add.aspx
public ActionResult Add()
{
return View();
}
}
}
相信大家看到这段代码后恍然大悟,系统将调用Views\Home\Index.aspx页面(个人认为是通过系统文件名来联系的)。
接下来我们来看看是如何通过Javascript来跳转页面的下面是Views\Home|Index.aspx页面的代码:
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<!DOCTYPE html>
<html>
<head runat="server">
<meta name="viewport" content="width=device-width" />
<title>Home Index</title>
<script type="text/javascript" src="../../Scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(function () {
//js跳转页面(/controller/action)
$('#jsTest').click(function () {
window.location.href = '/Home/Add';
});
});
</script>
</head>
<body>
<div>
<%--html跳转(/controller/action)--%>
<a href="/Home/Add">Home Add</a>
<input id="jsTest" type="button" value="Home Add" />
</div>
</body>
</html>
当单击<a>或者<input>系统将跳转到Controllers\HomeController.cs中的Add方法,然后再跳转到Views\Home\Add.aspx页面。