使用 ASP.NET MVC 创建一个完全基于 ajax 的网站答案

【问题标题】：Creating a fully ajax based website with ASP.NET MVC使用 ASP.NET MVC 创建一个完全基于 ajax 的网站
【发布时间】：2014-01-25 07:02:11
【问题描述】：

我的计划是创建一个完全基于 ajax 请求的网站。但我心中有一些疑问，

1- 我应该使用 javascript 路由引擎、库扩展吗？我真的需要吗？因为我正在做的网站很大，而且肯定会长大。

2- 我将通过 ajax 加载每个页面内容，但我不会使用 JSON，我打算使用 PartialViews 可以吗？

  <script type="text/javascript">
       $("a.ajax").click(function() {
           $(".placeholder").load(this.href);
           return false;
       });

   </script>
   <a class="ajax" href="/Home/Products/2">Products</a>
   <div class="placeholder"></div>

这是我的流程的简单代码，问题是这里的历史，当用户想要返回时，它会失败。我该如何解决这个问题？

【问题讨论】：

标签： jquery ajax asp.net-mvc asp.net-mvc-4 url-routing

【解决方案1】：

1- 我应该使用 javascript 路由引擎、库扩展吗？我真的吗需要它？因为我正在开发的网站非常大，而且会一定会长大的。

如果您在客户端上有很多逻辑，您可能会考虑使用一些 MVVM javascript 框架。 KnockoutJS 和 AngularJS 是一些受欢迎的选择。

2- 我将通过 ajax 加载每个页面内容，但我不会使用 JSON，我打算使用 PartialViews 可以吗？

您可以使用HTML5 History API，它允许您在每次发出 AJAX 请求时向浏览器历史记录添加条目。

这是一个例子：

$("a.ajax").click(function() {
    var href = this.href;
    var title = $(this).text();
    $(".placeholder").load(href, function() {
        // Add an entry in the browser history
        history.pushState(null, title, href);
    });
    return false;
});

【讨论】：

好的，很好。但我处理a.ajax 点击处理程序，我正在通过点击加载内容。那么如果用户想要返回会发生什么。将如何处理并加载历史页面内容？
只需订阅onpopstate 事件，该事件将在浏览器从历史记录中加载条目时触发，然后使用对您的服务器的必要 AJAX 调用重建页面。

【解决方案2】：

尝试查看 angularjs。 AngularJs + asp.net web api 将是不错的方法

【讨论】：

【解决方案3】：

回答 q1：最好使用一些 mvvm 框架，如 angular.js，但你也可以自己处理所有事情，当然如果你想处理这些事情，你必须编写更多代码！回答 q2：没关系，只需通过 ajax 调用调用一个动作方法，并在动作方法中渲染一个局部视图，并在你想要的任何地方更新你的成功函数，我也在使用这个方法:)

【讨论】：