锚点在 if 语句中不起作用

Anchors Not Working In If Statements

本文关键字:不起作用 语句 if      更新时间:2023-09-26

我在尝试解决此问题时遇到了很多麻烦。我有代码,如果满足锚点中的条件时更改 CSS 的语句,则应激活该代码。下面是代码的一个示例:

    window.setInterval(function() {
      var anchor = window.location.hash.slice(1);
      if (anchor = "Yellow") {
        $("body").css("background-color", "yellow");
      }
      if (anchor = "White") {
        $("body").css("background-color", "white");
      }
    }, 0);
<html>
<body>
  <a href="#Yellow">Yellow</a>
  <a href="#White">White</a>
</body>
</html>

请帮忙。谢谢。

变量比较

使用 === 检查 if 语句中的相等性:

window.setInterval(function() {
  var anchor = window.location.hash.slice(1);
  if (anchor === "Yellow") {
    $("body").css("background-color", "yellow");
  }
  if (anchor === "White") {
    $("body").css("background-color", "white");
  }
}, 0);

执行此操作时:

if(anchor = "string")....

您正在重新分配anchor变量,而不是检查其值。


事件监听

正如 A. Wolff 在他的评论中指出的那样,你应该使用它而不是0ms timeout

window.onhashchange = function(){ // This function gets called everytime the has changes
  var anchor = window.location.hash.slice(1);
  if (anchor === "Yellow") {
    $("body").css("background-color", "yellow");
  }
  if (anchor === "White") {
    $("body").css("background-color", "white");
  }
};

在这里查找不受支持的浏览器的回退:MDN

您可以使用 == 或 === 比较符号来检查 if 语句