jquery - 如果窗口宽度大于 800px，则删除此 div，但不刷新站点

Question

这个问题已经有答案了:

Hide div if screen is smaller than a certain width (5 个回答)

已关闭 5 年前。

我在 jquery 中遇到这个问题，当窗口宽度大于 800px 时，请删除此 div:

if ($(window).width() > 800) {
  $('.menu').remove();
}

但这不会立即发生，当窗口宽度大于 800px 时，您必须刷新网站。顺便提一句。我有一些 CSS 附加到 .menu 。我听说了有关事件的消息 preventDefault() ，但它适用于链接或类似的东西。你能帮我一下吗？

Answer 1

考虑使用 CSS 媒体查询而不是 jQuery:

@media (min-width: 800px) {
    .menu { display: none; }
}

如果您想使用 jQuery(或 JavaScript)，则需要将该代码放置在 resize 事件处理程序中:

$( window ).resize(function() {
  if ($(window).width() > 800) {
    $('.menu').remove();
  }
});

resize 事件在某些浏览器(尤其是移动浏览器)上无法顺利运行。