Question

我在这里有jquery：

  $(".cellphone-add").on "click", (e) ->
    if $(".cellphone2").show == true
      $(".cellphone3").removeClass('hidden')
      return false
    if $(".cellphone3").show == true
      $(".cellphone4").removeClass('hidden')
      return false
    if $(".cellphone4").show == true
      $(".cellphone5").removeClass('hidden')
      return false
    $(".cellphone2").removeClass('hidden')
    return false
    e.preventDefault()
    return false

这是我的观点：

    .row
      .pull-right.container
        .btn.btn-success.btn-xs.cellphone-add
          Add another field?
    .cellphone2.input-group.hidden
      = f.text_field :cellphone_2, class: 'char-max-length form-control', :maxlength => 11, :id => "cellphone-value-2"
      %span.input-group-btn
        .actions
          %a#cr2.btn.cellphone-remove.btn-xs.btn-link{:href => "#"}
            %i.icon-remove
    .cellphone3.input-group.hidden
      = f.text_field :cellphone_3, class: 'char-max-length form-control', :maxlength => 11, :id => "cellphone-value-3"
      %span.input-group-btn
        .actions
          %a#cr3.btn.cellphone-remove.btn-xs.btn-link{:href => "#"}
            %i.icon-remove
    .cellphone4.input-group.hidden
      = f.text_field :cellphone_4, class: 'char-max-length form-control', :maxlength => 11, :id => "cellphone-value-4"
      %span.input-group-btn
        .actions
          %a#cr4.btn.cellphone-remove.btn-xs.btn-link{:href => "#"}
            %i.icon-remove
    .cellphone5.input-group.hidden
      = f.text_field :cellphone_5, class: 'char-max-length form-control', :maxlength => 11, :id => "cellphone-value-5"
      %span.input-group-btn
        .actions
          %a#cr5.btn.cellphone-remove.btn-xs.btn-link{:href => "#"}
            %i.icon-remove

我要做的是我想逐个展示我的文本框。

例如，我点击“添加另一个字段？”按钮一次。并且cellphone_2 div将显示。然后我再次点击它，第二个文本框将显示。就像那样。我的视图代码没问题，但我知道我的jquery有问题。

谢谢！请帮忙。

Answer 1

只需调用第一个隐藏元素并在每次单击时显示它，同时删除隐藏类：

$(".cellphone-add").on "click", (e) ->
  $(".input-group.hidden").first().show().removeClass "hidden"

按钮显示文本框 - Jquery rails

1 个答案: