您可以遵循响应式设计方法。桌面用户不应看到基于 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 以及媒体查询和触摸检测来检测您是在基于触摸的移动设备上,还是在任何小于 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");
我希望这有帮助。