Как показывать 3 элемента в массиве каждый раз, когда я нажимаю на кнопку

Question

Я использую код ниже, чтобы показать только первые 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 элемента при нажатии на мою кнопку?

Answer 1

Я не уверен, какое именно поведение вы ищете, но, возможно, что-то подобное поможет:

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/

Answer 2

Я предполагаю здесь, но если вы только что выбрали те, которые были скрыты, вы теоретически должны иметь возможность отображать первые 3 каждый раз, и это будет работать.

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