javascript - 带有 javascript_tag 的 View 助手不起作用

Question

我正在编写一个 gem，它可以帮助轻松创建图表。Gem 是 d3.js 库的一些“上层建筑”...

所以，我正在尝试编写一些助手 chart_for，它必须在 html 页面上创建图表。

助手示例:

    def chart_for(text)
      bar_chart = %q[
        $( document ).ready(function() {
          var data = [4, 8, 16, 20, 12, 48];
          var x    = d3.scale.linear().domain( [0, d3.max(data)] ).range( [0, 420] );
          d3.select( ".chart" ).selectAll( "div" ).data( data ).enter().append( "div" ).style( "width", function( d ){ return x( d ) + "px"; } ).text( function( d ){ return d; } );
        });
      ]
      javascript_tag( bar_chart )
    end

但是，不幸的是我在 JS 加载方面遇到了一些问题。

这是我的页面来源:

页面的最后几行:

和错误:

据我了解，浏览器会在 d3.js 加载到页面之前尝试从我的助手运行 JS。我该如何修复它？

也许我的助手必须将 JS 代码写入 js 文件，而不是 html.erb 文件中？

也许我需要重新定义 javascript_tag 将 JS 代码从 helper 写入 html 页面的末尾？

请把我推向正确的方向:)

Answer 1

你可以尝试吗

jQuery(document).ready(function() {

而不是

$(document).ready(function() {

我曾经与我使用的一些库与 $ 发生冲突。这对我来说是一个快速但非常规的技巧。