为什么我无法访问CoffeeScript中的动态内容选择器?

时间:2015-12-23 13:24:48

标签: javascript jquery html coffeescript

我正在向页面添加动态内容,以将表单控件的数量限制为仅限用户需要的内容。我使用以下代码从下拉列表中获取用户选择的信息,然后我更改另一个限制他们可以搜索的信息的控件。例如,我不是允许某人执行first_name = 47之类的搜索,而是将表单控件更改为仅接受某些字符的文本框 - 将其限制为first_name = Steve

  $('body').on 'change', 'select[name$="[name]"]', ->

    # This block is simply figuring out which element was changed and locating it's corresponding form control where the user inputs information.
    name_string = $(this).attr 'id'
    selected_value = $("option:selected", this).text().toLowerCase()
    value_id = $(this).attr('id').replace('name', 'value')
    value_id = value_id.replace('a','v')

    # This block is executed if the attribute the user wishes to search on should only be true/false
    if attributes_for_true_false_select.indexOf(selected_value) > -1

      # Create a true/false drop down list with the correct `name` and `id` attributes
      true_false_drop_down_list = '<select class="form-control" name="' + $('input[id=\''+value_id+'\']').attr('name') +
        '" id="' + $('input[id=\''+value_id+'\']').attr('id') + '"><option value="1">True</option><option value="0">False</option></select>'

      # Replace the current form selector with the new true/false drop down list
      $('#'+value_id).replaceWith(true_false_drop_down_list)

    else if ...

现在上面的代码工作正常,但只是第一次。在我更改了表单控件一次后,再尝试再次执行,代码为$('input[id=\''+value_id+'\']').attr('name')$('input[id=\''+value_id+'\']').attr('id')返回'undefined'。我认为这是因为内容之前不存在,因此代码在动态添加后无法找到。虽然我希望将听众添加到$('body')会解决这个问题。谁能指出我正确的方向?谢谢!

1 个答案:

答案 0 :(得分:0)

问题原来是我构建新表单控件的部分我插入.. $('input[id=\''+value_id+'\']').attr('id') - 我只需要删除input部分,只需简单通过id属性查找。这是因为我添加的某些表单控件不是input,例如显示的select