ASP.Net MVC 4 使用 HTML 帮助程序同步模型中显示的数据

Question

我有一个使用媒体的iPad视图，当用户想要查看纵向或横向时，渲染的视图是不同的，但一切都设置在同一个文件上。

假设我们有

 <div class="portrait">
        <%= Html.CheckBoxFor(m => m.IsSelected, new { @checked = "checked" }) %>
 </div>

并在同一文件上：

 <div class="landscape">
        <%= Html.CheckBoxFor(m => m.IsSelected, new { @checked = "checked" }) %>
 </div>

在两者上拥有相同数据的最简单方法是什么？

我知道您可以使用 jQuery onChange 方法手动解决它，但是是否有任何开箱即用的方法我可以在 .Net MVC 中调用，例如SynchronizeView()或属性，并且所有元素在更改时都会获得相同的值。

Answer 1

在两者上具有相同数据的最简单方法是使用媒体查询。我强烈建议渲染一个 html 并通过样式调整外观。您可以使用orientation媒体查询：

@media screen and (orientation: portrait) { … }
@media screen and (orientation: landscape) { … }

有关 CSS 方向检测的详细信息

如果它不适合您，请确保您确实需要完全不同的纵向和横向视图。我担心它会降低您网站的用户体验，让用户感到困惑，并且肯定会使应用程序维护更加困难