时间戳

首页 > 解决方案 > 制作下拉框链接，具体取决于下拉选择 + 在下拉选择中更改 CSS

javascript - 制作下拉框链接，具体取决于下拉选择 + 在下拉选择中更改 CSS

问题描述

我有一个包含所有选项的下拉框，还有一个 go 按钮，当没有选择时，它具有 css 样式cursor: not-allowed;。我现在想要做的是，当我点击下拉菜单上的一个选项时，它会 a) 链接按钮 b) 将 csscursor样式更改为默认值。我知道这是某种形式，document.getElementById但我该如何触发呢？这是我到目前为止的代码。

<select>
<option value=1>Option 1</option>
<option value=2>Option 2</option>
<select>
<a id="link" href="#">
<button style="cursor: not-allowed;" id=nextbutton>GO</button>
</a>
      <script>
        document.getElementById("nextbutton").style.cursor = default
        document.getElementById("link").href = "/link"
      </script>

谢谢你的帮助！（我是 JS 新手，抱歉。）

标签： javascripthtmlcss

解决方案

change(0);
function change(index)
{
  if(index==1)
  {
    document.getElementById("nextbutton").style.cursor ="default"
document.getElementById("link").href = "/link"
  }
  if(index==0)
  {

    document.getElementById("nextbutton").style.cursor ="not-allowed"
document.getElementById("link").href = "#"

  }
}
<html>
<select onchange="change(this.selectedIndex);">
<option value=1>Default</option>
<option value=2>Link</option>
<select>
<a id="link" href="#">
<button style="cursor: not-allowed;" id=nextbutton>GO</button>
</a>
</html>

推荐阅读