鍍金池/ 問答/HTML/ matchMedia 能否同時(shí)監(jiān)聽 min-width和max-width

matchMedia 能否同時(shí)監(jiān)聽 min-width和max-width

看到網(wǎng)上很多文章都是只針對(duì)要么min-width,要么max-width來監(jiān)聽

var mql = window.matchMedia('(max-width: 760px)');
function screenTest(e) {
  if (e.matches) {
    document.body.style.backgroundColor = 'red';
  } else {
    document.body.style.backgroundColor = 'blue';
  }
}
mql.addListener(screenTest);

但是如果我這么寫就不管用了

var mql = window.matchMedia('(min-width:380) and (max-width: 760px) ');
mql.addListener(screenTest);

請(qǐng)問怎樣才能同時(shí)監(jiān)聽是否滿足最大和最小值?

回答
編輯回答
陪妳哭

根據(jù) mdn 測試媒體查詢 的說法應(yīng)該是沒有'(min-width: 380px) and (max-width: 760px)',這種寫法的
你可以試試這樣

window.matchMedia("(min-width: 380px)").matches &&
    window.matchMedia('(max-width: 760px)').matches
2018年3月13日 10:24