jQuery和switch语句

Question

我使用jQuery的switch语句（参见下文）有问题：

$(window).scroll(function() {
var sc = $(document).scrollTop();
switch (sc) {
case sc > 200:
    $('.row1').fadeIn();
    break;  
case sc > 600: 
    $('.row2').fadeIn();
    break;     
case sc > 1000:  
    $(".row3").fadeIn(); 
}
});

情况是，当我向下滚动200px时，应显示class =“ row1”的div标签。但是它没有出现。

有人知道我的代码有什么问题吗？

谢谢

Answer 1

您不能>在switch语句中使用。

而是使用一条if ... else if链：

var sc = $(document).scrollTop();
if (sc > 1000) {  
    $(".row3").fadeIn(); 
} else if (sc > 600) {
    $('.row2').fadeIn();
} else if (sc > 200) {
    $('.row1').fadeIn();
}

注意：请注意条件是相反的，因此您可以获得正确的结果。如果您将它们保留为原始顺序，那么到达时if (sc > 1000)将永远是不正确的。这样的值sc早就已经可以处理了if (sc > 200)。

另类

如果您喜欢紧凑的代码，则也可以使用三元运算符编写此代码，并且仅在不同的部分（即以下数字）上工作row：

$(".row" + (sc > 1000 ? 3 : sc > 600 ? 2 : sc > 200 ? 1 : 0)).fadeIn(); 

这可能会产生选择器.row0，但是那样（应该）不存在，在这种情况下将不会发生任何事情。