使用按钮显示项目

Question

我有这个javascript代码：

function newsOverview() {
    $(".list-news li:gt(3)").hide();
    $(".box-news .btn-1").on('click', function(e){
        e.preventDefault;
        $(".list-news li:visible:last").nextAll(":lt(4)").fadeIn(600);
    });
};

我有很多关于li的物品。 该脚本每次显示4个li项目。 当您单击btn-1按钮时。 但是现在我对此脚本有疑问。

• 为什么e.preventDefault不起作用？ 当我单击按钮。 我滚动回到页面顶部。 为什么那不起作用？
• 并且，是否可能。 当所有项目都可见时。 该按钮消失。

Answer 1

1）preventDefault不起作用，因为它是一个函数。 它应如下所示：

e.preventDefault();

2）要查看所有项目是否可见，请尝试使用以下代码：

if ($(".list-news li:hidden").lehgth == 0) {
   $(".box-news .btn-1").hide();
}

Answer 2

为什么e.preventDefault不起作用？

您实际上缺少括号以实际调用 preventDefault ：

function newsOverview() {
    $(".list-news li:gt(3)").hide();
    $(".box-news .btn-1").on('click', function(e){
        e.preventDefault(); // don't forget those
        $(".list-news li:visible:last").nextAll(":lt(4)").fadeIn(600);
    });
};

并且，是否可能。 当所有项目都可见时。 该按钮消失。

我的jQuery有点生锈，但是类似的东西应该可以工作：

function newsOverview() {
    $(".list-news li:gt(3)").hide();
    $(".box-news .btn-1").on('click', function(e){
        e.preventDefault();
        if($(".list-news li:hidden").length === 0)
            $(this).hide();
        else
            $(".list-news li:visible:last").nextAll(":lt(4)").fadeIn(600);
    });
};

Answer 3

e.preventdefault（）; 不工作

并且，您始终可以使用“ return false”； 我认为。