0

这是对以下问题的后续问题,主要是因为我尝试在其上使用一些解决方案但无法解决:

选择下拉选项时,仅更改同一 div 内的图像

给定一个有很多问题的表单,并且您可以选择将问题设置为多项选择并为其添加答案,我有以下问题视图(field_answers 方法只呈现部分问题):

.nested-fields
  = f.input :question
  = f.input :type
  #answers{:style => "display:none;"}
    = f.simple_fields_for :answers do |m|
      = field_answers(m)
    %div{:class => "#links"}
      = link_to_add_association '+', f, :answers, :partial => 'layouts/form/answers', :class => 'link-add-field'
  = link_to_remove_association "remove question", f

以下是答案:

.fields.answers-nested-fields
  #answer-field
    = f.input :answer
    = link_to_remove_association "-", f, { wrapper_class: 'answer-nested-fields',  :class => 'link-add-field remove_nested_fields' }

我的 questions.js.coffee 有以下回调:

$('#type').change ->
  if $(this).val() is "text"
    $("#answers").hide()
  else
    $("#answers").show()

$(document).ready ->
  $('#questions').on("cocoon:before-insert", (e, question_to_be_added) ->
    question_to_be_added.fadeIn "slow"
  ).on("cocoon:after-insert", (e, added_question) ->
    added_question.css "background", "red"
  ).on "cocoon:before-remove", (e, question) ->
    # allow some time for the animation to complete
    $(this).data "remove-timeout", 5000
    question.fadeOut "slow"

第一点是使第一个问题的答案显示或隐藏的方法,显然它不适用于新添加的问题,因为我想我需要插入前/插入后回调来创建一个显示事件的事件当问题类型更改为“文本”以外的任何内容时,答案字段上的 /hide 会被触发,那么如何观察问题类型属性上的更改事件?

4

1 回答 1

0

想出了一个解决方案,这确实是一个 jQuery 问题,我只需要使用 .find()

$(document).ready ->
  $('#questions')
  ).on("cocoon:after-insert", (e, added_question) ->
    added_question.find('#type').change ->
      if $(this).val() is "text"
        added_question.find("#answers").hide()
      else
        added_pergunta.find("#answers").show()
  )
于 2014-08-28T18:07:46.877 回答