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，但由于（不应该）存在，在这种情况下不会发生任何事情。

jQuery和switch语句

1 个答案:

替代