有没有办法检测用户是否在jQuery中使用移动设备?类似于CSS@media属性?如果浏览器在手持设备上,我希望运行不同的脚本。
jQuery$.browser函数不是我想要的。
有没有办法检测用户是否在jQuery中使用移动设备?类似于CSS@media属性?如果浏览器在手持设备上,我希望运行不同的脚本。
jQuery$.browser函数不是我想要的。
当前回答
所有答案都使用用户代理来检测浏览器,但基于用户代理的设备检测不是很好的解决方案,最好是检测触摸设备等功能(在新的jQuery中,他们删除了$.browser,改用$.support)。
要检测移动设备,您可以检查触摸事件:
function is_touch_device() {
return 'ontouchstart' in window // works on most browsers
|| 'onmsgesturechange' in window; // works on ie10
}
摘自使用JavaScript检测“触摸屏”设备的最佳方法是什么?
其他回答
此外,我建议使用小型JavaScript库Bowser,yes no r。它基于navigator.userAgent,对所有浏览器(包括iPhone、Android等)都进行了测试。
https://github.com/ded/bowser
你可以简单地说:
if (bowser.msie && bowser.version <= 6) {
alert('Hello China');
} else if (bowser.firefox){
alert('Hello Foxy');
} else if (bowser.chrome){
alert('Hello Silicon Valley');
} else if (bowser.safari){
alert('Hello Apple Fan');
} else if(bowser.iphone || bowser.android){
alert('Hello mobile');
}
http://www.w3schools.com/jsref/prop_nav_useragent.asp
按平台名称筛选。
Ex:
x = $( window ).width();
platform = navigator.platform;
alert(platform);
if ( (platform != Ipad) || (x < 768) ) {
}
^^
如果要测试用户代理,正确的方法是测试用户代理(即测试navigator.userAgent)。
如果用户伪造了这一点,他们就不必担心了。如果您测试.isUnix(),则不必担心系统是否为Unix。
作为一个用户,改变userAgent也可以,但如果你这样做了,你不希望站点能够正确呈现。
如果您希望为Microsoft浏览器提供支持,则应确保内容的前几个字符包含并测试您编写的每一页。
要旨始终按照标准进行编码。然后破解它,直到它在当前版本的IE中工作&不要期望它看起来很好。GitHub就是这么做的,他们刚刚拿到了1亿美元。
看看这篇文章,它提供了一个非常好的代码片段,说明当检测到触摸设备时该怎么做,或者如果调用了touchstart事件,该怎么做:
$(function(){
if(window.Touch) {
touch_detect.auto_detected();
} else {
document.ontouchstart = touch_detect.surface;
}
}); // End loaded jQuery
var touch_detect = {
auto_detected: function(event){
/* add everything you want to do onLoad here (eg. activating hover controls) */
alert('this was auto detected');
activateTouchArea();
},
surface: function(event){
/* add everything you want to do ontouchstart here (eg. drag & drop) - you can fire this in both places */
alert('this was detected by touching');
activateTouchArea();
}
}; // touch_detect
function activateTouchArea(){
/* make sure our screen doesn't scroll when we move the "touchable area" */
var element = document.getElementById('element_id');
element.addEventListener("touchstart", touchStart, false);
}
function touchStart(event) {
/* modularize preventing the default behavior so we can use it again */
event.preventDefault();
}
这似乎是一个全面的现代解决方案:
https://github.com/matthewhudson/device.js
它可以检测多个平台,智能手机与平板电脑,以及方向。它还将类添加到BODY标记中,因此检测只发生一次,您可以通过一系列简单的jQuery hasClass函数来读取所使用的设备。
过来看。。。
[免责声明:我与写这封信的人无关。]