每次用户点击相同按钮时，如何显示N个div？

Question

假设我们有18个div，但只有4个可见，低于＆＃34;更多＆＃34;按钮。我想在用户点击此按钮时显示接下来的4个div，并重复此过程，直到没有更多的div显示。可能吗？ 我无法找到答案并解决它。

Answer 1

Here就是一个很好的例子。基本上，点击你只需删除div上的隐藏类。

**//*[local-name()='access_token']**

Answer 2

使用.slice

使用JQuery选择器的工作示例 https://jsfiddle.net/duf9xcyz/

这将允许您仅从jquery选择器

中选择前4项

$('div:hidden').slice(0,4).show();

https://api.jquery.com/slice/

Answer 3

您可以使用jquery点击“查看更多”按钮来创建div。或者你可以拥有html中的所有div，但是用'display：none'标记其中的14个，并且点击'see more'按钮，你可以使用jquery在点击按钮时切换下一个4。

Answer 4

在jQuery中你可以这样做：

        var allDivs = $('div'),
            counter = 4; //initial number of divs displayed

        var showDivs = function() {
            for (var i = 0; i < 4; i = i + 1) {
                if (counter === allDivs.length) {
                    console.log('All divs are displaying');
                    break;
                }
                $(allDivs[counter]).show();
                counter = counter + 1;
            }
        };
        $('#aButton').click(showDivs);