Question

我正在编写一个if / else语句，我已将其简化为下面的小提琴链接。基本上我检查CSS属性的值，如果它是一个特定值，那么我想要发生一件事，如果它是一个不同的值（非特定的，只是任何其他值），那么我想要另一件事发生。

$(document).ready(function (){
if($(".header-wrapper").css("height") == "100px"){
    alert("true");
}
else{
    alert("false");
}
$(".below").click(function(){
    $(".header-wrapper").css("height", "200px");
});
});

但由于某种原因，我的代码会检查CSS值一次，如果CSS值发生变化则不会执行任何操作，并且我希望每次CSS值更改为特定值时触发此事件。感谢您的帮助。

https://jsfiddle.net/hyfpw92w/

Answer 1

您需要将IF / ELSE放在一个函数中。然后在希望它在高度变化上运行时调用该函数。

像这样：

function myFunction(){
        if($(".header-wrapper").height() == 100){
            console.log("true");
        } else {
            console.log("false");
        };
    };

然后当您想要使用它时，您可以执行myFunction();

Answer 2

你的代码的问题是document.ready（）只发生一次，所以提供的函数只能被调用一次。相反，您需要将一个事件侦听器附加到一个元素（可能是更改css的元素），以便可以多次调用它。您可以阅读有关事件监听器here的更多信息。您还可以查看有关收听样式更改here

的类似问题

// attach this event to the specific element which is changing
// the css instead

document
  .addEventListener('click', function(){
     if($(".header-wrapper").css("height") == "100px"){
        alert("true");
      }
      alert("false");
  });

if / else语句检查css属性jquery

2 个答案: