jQuery 显示方法在 rails 应用程序中不起作用

Question

(jQuery/Javascript 这里是新手)

在我的 rails 应用程序中，我试图查看下拉菜单中的选定选项是否与文本 "New Category" 匹配，如果是，那么我想要一块 html 为表单显示一个新行，用户可以在其中指定新的类别名称。

在我的 class.coffee 文件中我有这个：

$(document).on "turbolinks:load", ->
  if( $('#category-select option.selected').text() == "New Category")
    $('#new-categrory').show()

在我的 class.html.erb 文件中我有这个：

<div class="col-xs-6 center block">
            <%= f.label :category, "Category" %>
            <%= f.select :category, options_for_select(getAllCategories), {}, {:required => true, :class => 'form-control', id: "category-select"} %>
            <%= f.text_field :category, :class => 'form-control', id: "new-category" %>
</div>

（我的 getAllCategories 函数只是 returns 一个选项数组，但这并不重要）

最后，我的 class.scss 中有一个 class 规则：

#new-category{
display: none;
}

所以我很困惑。我已经尝试使用来自多个 Whosebug 问题的语法，但还没有任何效果。

我已经能够在选择下拉菜单时运行弹出一个简单的警报，所以我知道 jQuery 是运行ning。

如有任何帮助，我们将不胜感激。

Answer 1

您的 coffeescript 文件中的缩进可能是问题所在，请尝试将第二行缩进一级，例如：

$(document).on "turbolinks:load", ->
  if( $('#category-select option.selected').text() == "New Category")
    $('#new-categrory').show()

Here is a link showing the issue with what you have now ---- NOTE: had use a weird link shortener because the coffeescript compiler was generating url that didn't mesh nicely with markdown.

Answer 2

我知道怎么做了。

我运行一旦“#select-类别”ID 发生更改，所以

$(document).on "turbolinks:load", ->
    $('#category-select').change ->
        selected = $('#category-select').val()
        if selected is "New Category"
            $('#new-category').show()
        else
            $('#new-category').hide()

终于成功了。希望能帮助其他人运行解决这个问题。

jQuery 显示方法在 rails 应用程序中不起作用

jQuery show method not working in rails app

jquery

coffeescript

ruby-on-rails-5