每次单击按钮时如何在数组中显示 3 个项目答案

【问题标题】：How to show 3 items in an array every time I click on button每次单击按钮时如何在数组中显示 3 个项目
【发布时间】：2012-02-16 00:34:02
【问题描述】：

我使用下面的代码默认只显示数组中的前 3 个项目

//Hides all but first 3 items in the array
@$('.question_container')[3..-1].hide()

现在，我想在单击按钮时显示数组中的下 3 个项目，并在再次单击按钮（并重复）时显示随后的 3 个项目。

目前，我只能使用以下代码在单击时显示数组中的所有剩余项目

showMoreQuestions: (e) ->
    e.preventDefault()
    @$('.question_container')[3..-1].show()
    false

如何修改上面的代码，以便在单击按钮时只显示 3 个项目？

【问题讨论】：

那是什么语言？（您是否忘记了问题的标签？）
@nnnnnn 看起来像是使用 jQuery 的 C、Pseudo 和 Javascript 的组合 ^^;
@nnnnnn 我相信是咖啡脚本
对不起，是的，我正在使用咖啡脚本。谢谢
您要显示 3，然后是 6，然后是 9，还是先显示 3，然后再显示下一个 3？

标签： javascript jquery arrays coffeescript

【解决方案1】：

我在这里猜测，但如果你只是选择了隐藏的那些，理论上你应该能够每次都显示前 3 个并让它工作。

showMoreQuestions: (e) ->
    e.preventDefault()
    @$('.question_container:hidden')[0..2].show()
    false

【讨论】：

【解决方案2】：

我不确定您正在寻找什么行为，但也许这样的事情可以解决问题：

showMoreQuestions: (e) ->
    e.preventDefault()
    first = @$('.question_container:visible').length - 1
    @$('.question_container')[first .. first+3].show()
    false

您只需要查看当前可见的数量并使用它来为show 构建切片。每次您拨打showMoreQuestions 时，都会显示另外三个。

演示：http://jsfiddle.net/ambiguous/Ybz8h/

如果您只想一次显示三个（而不是一次显示三个），那么可以这样：

showMoreQuestions: (e) ->
    @offset ?= 3
    e.preventDefault()
    $('.question_container')[@offset - 3 .. @offset    ].hide()
    $('.question_container')[@offset     .. @offset + 2].show()
    @offset += 3
    false

演示：http://jsfiddle.net/ambiguous/r8Hhb/

【讨论】：