Safari忽略window.matchMedia

Question

我正在使用window.matchMedia条件,以避免在移动设备中注入视频.这里说自从Safari 9(我正在测试它)之后,matchMedia将顺利运行,但我的代码完全被忽略了:

if ( window.matchMedia("(min-width: 1025px").matches) {
   console.log('match');

   document.addEventListener("DOMContentLoaded", function() { initialiseMediaPlayer(); }, false);

   function initialiseMediaPlayer() {

      (stuff here...)

   }

}

此代码适用于Chrome,Chromium,Firefox,IE和Edge.

有没有人有类似的问题？

Answer 1

问题在于格式化,奇怪的是其他浏览器修复了行为,即使它格式不正确.在1025px之后,它缺少一个额外的结束")括号.尝试:

if ( window.matchMedia('(min-width:1025px)').matches) {
   console.log('match');

   document.addEventListener("DOMContentLoaded", function() { initialiseMediaPlayer(); }, false);

   function initialiseMediaPlayer() {

      (stuff here...)

   }

}

Answer 2

对于可能遇到类似问题的其他人，我发现在 safari 中您需要包括“屏幕和”以及宽度设置。其他浏览器似乎假设您在谈论屏幕宽度，但 safari 需要指定它，至少在我的情况下。所以会是这样的：

if ( window.matchMedia('screen and (min-width:1025px)').matches) {}

在这种情况下