1

背景和工具：

我正在使用带有 Rails的Bootstrap Tags Input jQuery 插件。

我将插件存储为vendor/assets/javascripts/bootstrap-tagsinput.js，它的样式表为vendor/assets/stylesheets/bootstrap-tagsinput.css.

我在数字图书馆 Rails 应用程序中标记了我的所有书籍。

问题：

如果我直接导​​航到Book#newor Book#edit，标签将按项目演示页面的预期工作。

但是，如果我通过单击另一个页面的链接导航到Books#edit或页面，那么我的文本输入将被格式化为典型的 html 文本输入，并显示以逗号分隔的字符串。Books#newscience,fiction,good,short

更多信息：我的输入如下所示：

<input class="form-control tagsinput" data-role="tagsinput" id="books_tags"
name="books[tags]" type="text" value="science,fiction,good,short">

该bootstrap-tagsinput.js文件在文件底部有这些行：

  /**
   * Initialize tagsinput behaviour on inputs and selects which have
   * data-role=tagsinput
   */
  $(function() {
    $("input[data-role=tagsinput], select[multiple][data-role=tagsinput]").tagsinput();
  });
})(window.jQuery);

似乎这个初始化是由 Rails 运行的，并<input>在直接输入 URL 位置时应用它的 JavaScript 魔法，但不是在通过页面上的链接导航时。

问题：

从另一个页面导航时如何让初始化运行？

4

1 回答 1

3

放置初始化代码app/assets而不是vendor/assets将在页面加载时运行初始化。该bootstrap-tagsinput.js库仍将通过 加载vendor/assets，但初始化将需要通过 运行app/assets。

删除这些行vendor/assets/javascripts/bootstrap-tagsinput.js：

  $(function() {
    $("input[data-role=tagsinput], select[multiple][data-role=tagsinput]").tagsinput();
  });

并将它们放在资产管道内的 JS 文件中：app/assets/javascripts/books.js.

  $(function() {
    $("input[data-role=tagsinput], select[multiple][data-role=tagsinput]").tagsinput();
  });

移动内容将确保初始化运行。不要简单地复制这些行，否则初始化将运行两次 - 这真的会弄乱你漂亮的标签输入插件的外观。

于 2014-11-19T06:56:10.003 回答