Question

我写了一个简单的咖啡脚本，根据下拉菜单中的选定选项显示/隐藏日期选择器，它可以工作，但有一个小缺陷-在我选择日期选择器中的日期并提交表格后，日期选择器消失了，我认为，这可能会使最终用户感到困惑。为了解决这个问题，我编写了附加功能并“在窗口加载时”执行了该功能，但这破坏了我的Jasmine测试，使得整个测试套件甚至无法在本地和CI上运行。

这是我写的代码。

根据下拉菜单中的选定值打开/关闭日期选择器的功能

$(document).on 'ready page:load page:restore', ->
  $('body').on 'change', '.filter_status', (ev) ->
    selected = ev.target.value
    if selected == 'option_1' || selected == 'option_2'
      $('#datepicker').show()
    else $('#datepicker').hide()

检查仍处于选中状态并打开/关闭日期选择器的功能

toggleDatepicker = ->
    selected = $('.filter_status #status').children('option:selected').val()
    if selected == 'option_1' || selected == 'option_2'
      $('#datepicker').show()

在窗口加载时执行功能。

window.onload = toggleDatepicker

这很好，但是当我转到http://localhost:3000/specs来运行JS测试时，什么也没发生。我有200多个测试，而且都没有运行，我所看到的只是空白页。同样，它破坏了我的CI测试版本，该版本挂起。您有什么想法我可以解决这个问题吗？

这是整个脚本。

$(document).on 'ready page:load page:restore', ->
  $('body').on 'change', '.filter_status', (ev) ->
    selected = ev.target.value
    if selected == 'option_1' || selected == 'option_2'
      $(#datepicker').show()
    else $('#datepicker').hide()

  toggleDatepicker = ->
    selected = $('.filter_status #status').children('option:selected').val()
    if selected == 'option_1' || selected == 'option_2'
      $('#datepicker').show()
  window.onload = toggleDatepicker

Answer 1

我找到了一个更简单的解决方案。我通过定义一个辅助方法来在Rails模板中动态设置类，该方法根据UI表单传递的查询字符串返回一个CSS类。

CoffeeScript在页面加载时执行函数

1 个答案: