在网页中保持导航抽屉打开的方法可以通过使用HTML、CSS和JavaScript来实现。以下是一种解决方法的示例代码：

HTML:

  


Toggle Drawer

CSS:

.nav-drawer {
  width: 250px;
  height: 100vh;
  position: fixed;
  top: 0;
  left: -250px;
  background-color: #f1f1f1;
  transition: left 0.3s ease;
}

.nav-drawer.open {
  left: 0;
}

.toggle-drawer {
  position: absolute;
  top: 10px;
  left: 10px;
}

JavaScript:

const drawer = document.getElementById('nav-drawer');
const toggleButton = document.getElementById('toggle-drawer');

toggleButton.addEventListener('click', function() {
  drawer.classList.toggle('open');
});

// 保持抽屉打开
window.addEventListener('beforeunload', function() {
  if (drawer.classList.contains('open')) {
    localStorage.setItem('drawerOpen', 'true');
  } else {
    localStorage.setItem('drawerOpen', 'false');
  }
});

window.addEventListener('load', function() {
  const drawerOpen = localStorage.getItem('drawerOpen');
  if (drawerOpen === 'true') {
    drawer.classList.add('open');
  }
});

上述代码中，我们使用了一个具有固定宽度和高度的 nav-drawer 元素来作为导航抽屉。初始状态下，抽屉在页面的左侧隐藏。点击按钮 toggle-drawer 会切换抽屉的打开/关闭状态。

为了保持抽屉在刷新页面后保持打开状态，我们使用了 localStorage 来存储抽屉的状态。在页面即将卸载之前，我们会将抽屉的状态存储在 localStorage 中。在页面加载完成后，我们会检查 localStorage 中存储的抽屉状态，并根据其值来设置抽屉的打开/关闭状态。

请注意，上述代码仅为示例，具体的实现方法可能因实际需求而有所不同。