0

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

通过 jQM 实现 AJAX 导航的链接“劫持”,他们实质上破坏了“Shift click opens in new window, Ctrl click opens in new tab”的功能。我想为我们的 PC 用户保留此功能。

这不是什么大不了的事,因为绝大多数用户不会知道这一点,但就个人而言,当我使用一个不尊重这一点的网站时,它会让我大吃一惊,所以我想尊重它.

有什么办法可以让 jQM 工作吗?

谢谢!
丹尼尔

4

1 回答 1

0

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

您可以将ModernizYepnope一起使用来实现如下方法:

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 以及媒体查询和触摸检测来检测您是在基于触摸的移动设备上,还是在任何小于 480 像素的设备上。在每种情况下,适当的 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");

我希望这有帮助。

于 2013-06-12T19:04:50.080 回答