html - 在页面加载时设置选项的背景颜色

Question

我正在涉足 NodeJS Express。 在从主页路由到的页面上，我有一个下拉框，如图所示 here

onchange 事件效果很好，是我从 here 中找到的解决方案

我的目标是通过 onload 事件或使用 javascript/jQuery 在页面加载时设置 CSS 的背景颜色。

我尝试用 onload 代替 onclick

onload="this.className=this.options[this.selectedIndex].className">

这没用。

页面加载时使用的选项值是从数据库中选择的，因此每次调用此页面时它都可能不同。这不需要特定于浏览器，因为我只使用 Chrome

Answer 1

load事件仅适用于 body元素和从 HTML 文档外部加载内容的元素( img 、 iframe 、 script 等)如果您只添加一个 script到文档末尾，它将在您的 select 之后执行菜单已加载。

试着把它放在收盘前 </body>标签:

<script>
  var dropdown = document.querySelector('select');
  dropdown.className = dropdown.options[dropdown.selectedIndex].className;
</script>

如果你有多个 select菜单，你可能想给每个菜单一个 id归因并使用它来找到它们；上面的代码只会影响页面上的第一个。