jquery - 如何在没有适合移动设备的 View 的本地链接上自动禁用 AJAX？

Question

我正在使用 Jquery Mobile 构建现有 ASP.NET mvc3 网站的移动版本。

我这样做的方法是在我的 Controller 中检测移动设备是否正在请求页面，然后如果有，则提供适合移动设备的 mvc View ，如果没有，则提供标准 View 。

我遇到的问题是，指向没有合适 View 的页面的链接仍然通过 jquery-mobile 通过 Ajax 进入页面，从而弄乱了布局。我知道您可以使用 data-ajax="false"在逐个链接的基础上禁用此功能，但是我无法控制每个链接，因为它是基于 CMS 的网站，因此没有什么可以阻止用户链接到网站内没有移动 View 的页面。

我希望我能做的是在网站的桌面版本的基本 View 中包含一个属性，jquery mobile 在尝试 ajax 加载页面时会拾取该属性，拒绝它并在没有 ajax 的情况下重新加载链接。这可能吗？

Answer 1

我建议渲染一些本地化 JS 和 ViewBag 属性的组合来处理每个页面的问题，否则您最终会遇到必须在各处应用“data-ajax="false"”的情况，这不太漂亮。

除了可能是用户代理检测以填充“ViewBag.IsMobileDevice”属性的 Controller 代码之外，类似以下内容可能会帮助您:

<script type="text/javascript">

    $( document ).bind( "mobileinit", function( event, data ){
        if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion) && @ViewBag.IsMobileDevice) {
            $.mobile.ajaxEnabled = false;
        }
    });

</script>

请注意，我使用 iphone/ipad/ipod 作为示例，但您可以根据您的要求在其中使用任何内容。我会调查51degrees.mobi获取有关移动检测的一些灵感。

我希望这对您有所帮助，或者至少为您指明了正确的方向。