javascript - 如何检测设备是否支持鼠标？

我目前使用以下测试(从Modernizr中删除)来检测触摸支持:

function is_touch_device() {
    var bool;
    if(('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch) {
        bool = true;
    } else {
        injectElementWithStyles(['@media (',prefixes.join('touch-enabled),('),mod,')','{#modernizr{top:9px;position:absolute}}'].join(''), function(node) {
            bool = node.offsetTop === 9;
        });
    }
    return bool;
}

但是某些设备是由触摸和鼠标驱动的，因此我想要一个单独的功能来检测设备是否具有鼠标支持。什么是进行此检查的好方法？

最终，我的意图是能够做到以下几点:

if(is_touch_device())

if(has_mouse_support())

if(is_touch_device() && has_mouse_support())

最佳答案

只是有a CSS media!

您可以通过获取pointer CSS媒体功能的值来检查某些设备是否具有鼠标:

if (matchMedia('(pointer:fine)').matches) {
  // Device has a mouse
}

因为它是CSS，所以您甚至不需要使用JavaScript:

@media (pointer: fine) {
  /* Rules for devices with mouse here */
}

关于javascript - 如何检测设备是否支持鼠标？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21054126/