Question

我正在建立一个需要感觉“应用”的网站，用户将主要使用手机和平板电脑，但有些用户也会使用PC。

通过“劫持”jQM实现AJAX导航的链接，它们实际上破坏了“在新窗口中按住Shift键，在新标签中按住Ctrl键”的功能。我想为我们的PC用户保留这项功能。

这不是一个大问题，因为绝大多数用户都不会知道这一点，但就个人而言，当我使用的网站不尊重这一点时，它会让我大吃一惊，所以我想要尊重它。

有没有办法让这个工作与jQM一起使用？

谢谢！
丹尼尔

Answer 1

您可以遵循响应式设计方法。桌面用户不应该看到基于jQM的网站。

您可以使用Moderniz和Yepnope来实施以下方法：

test: Modernizr.mq( "only all and (max-width: 640px)" ),
yep: {
    "jqmcss": "css/jquery.mobile-1.3.1.min.css",
    "mcss": "css/mobile.screen.css"
},
nope: {
    //desktop
    "scss": "css/desktop.screen.css"
},
callback: {
    //use the callbacks from above and load jQuery Mobile 1.3.1
    "jqmcss": function( url, result, key ) {
        yepnope({
            load: "js/libs/jquery.mobile-1.3.1.min.js"
        });
    },
    "scss": function( url, result, key ) {
        // do something
    }
}

您可以使用Modernizr以及媒体查询和触摸检测来检测您是使用基于触摸的移动设备，还是使用低于480px的设备。在每种情况下都会动态和异步地加载适当的CSS和JS文件。仅在检测到移动设备时才加载jQM。请注意，上述代码不完整。我已经添加了它，以便了解这种方法的工作原理。

在我看来，响应式设计是正确的方法。但是，当您检测到您在桌面上时，也许可以尝试以下“脏”解决方案：

Ctrl +点击：

$('a').click(function(event){
    if (event.ctrlKey && event.button === 0) {
        event.preventDefault();
        window.open($(this).attr("href"), '_blank');
    }
});

或者您可以使用以下命令禁用锚点的Ajax过渡：

$('a').attr("data-ajax", "false");

我希望这会有所帮助。

当在桌面上单击链接时，我可以让jQuery Mobile尊重Shift和Ctrl吗？

1 个答案: