在rails視圖中將ruby變量傳遞給javascript函數

我想知道在rails視圖中將變量傳遞給JavaScript函數的最佳做法是什麼。現在我正在做類似：在rails視圖中將ruby變量傳遞給javascript函數

<% content_for :javascript do %> 
    <script type="text/javascript"> 
    Event.observe(window, 'load', function(){   
     js_function(<%= @ruby_array.to_json %>, <%= @ruby_var %>);)} 
    </script> 
<% end %>

這是正確的方式去呢？

來源

2010-03-17 TenJack

有幾個選項：

escape_javascript

別名：j。

僅適用於字符串。

將可以在Javascript字符串中具有特殊含義的字符（，如反斜槓轉義字符）轉換爲適合放入JavaScript字符串引號內的格式。

維護輸入html_safe狀態，所以需要html_safe另有特殊的HTML字符像<會得到逃到<。

<% a = "\\n<" %> 
<%= javascript_tag do %> 
    '<%= j(a)   %>' === '\\n&lt;' 
    '<%= j(a).html_safe %>' === '\\n<' 
<% end %>

to_json + html_safe

正如維亞切斯拉夫提到，去給予好評他。

因爲JSON是almost a subset of Javascript object literal notation。

不僅適用於散列對象，還適用於將轉換爲相應數據類型的JSON片段的字符串，數組和整數。

<% data = { key1: 'val1', key2: 'val2' } %> 
<%= javascript_tag do %> 
    var data = <%= data.to_json.html_safe %> 
    data.key1 === 'val1' 
    data.key2 === 'val2' 
<% end %>

數據 - 屬性

添加值的屬性，獲取它們的JavaScript DOM操作。

更好地與content_tag幫手：

<%= content_tag 'div', '', id: 'data', data: {key1: 'val1', key2: 'val2'} %> 
<%= javascript_tag do %> 
    $('#data').data('key1') === 'val1' 
    $('#data').data('key2') === 'val2' 
<% end %>

有時被稱爲「非侵入式JavaScript」。

坤

庫專門用於這項工作：https://github.com/gazay/gon

可能是最強大的解決方案。

的Gemfile：

gem 'gon'

控制器：

gon.key1 = 'val1' 
gon.key2 = 'val2'

佈局app/views/layouts/application.html.erb：

<html> 
<head> 
    <meta charset="utf-8"/> 
    <%= include_gon %>

查看：

<%= javascript_tag do %> 
    gon.key1 === 'val1' 
    gon.key2 === 'val2' 
<% end %>

又見

Injecting variable values into javascript and HAML in RoR

來源

2014-06-27 16:38:22

有一種技術叫做「不顯眼的javascript」。這裏有一個關於它的Railscast：link text。它與原型和jQuery一起工作。還有一些插件可以幫助簡化文章中描述的一些任務。

來源

2010-03-17 18:51:18 Zepplock

- content_for :javascripts_vars do 
    = "var costs_data = #{@records[:cost_mode][:data].to_json}".html_safe 
    = "var graph_data = #{@records[:cost_mode][:graph].to_json}".html_safe

來源

2012-09-26 12:55:51

我發現寶石client variable，它可以幫助你輕鬆地做到這一點。

來源

2013-09-16 07:11:57 MQuy

請嘗試讀取這個http://stackoverflow.com/help/deleted -answers，以獲得更多的理解如何**不**回答。即：「不能從根本上回答問題的答案」：**僅僅是一個鏈接到外部網站** – 2013-09-16 07:31:17

謝謝，我會在我的答案中提供更多詳細信息 – MQuy 2013-09-16 13:15:18

在HAML可以將數據都如此：

.position{data: {latitude: @claim.latitude.to_json, longitude: @claim.longitude.to_json}} 

:javascript 
    var latitude = $('.position').data('latitude'); 
    var longitude = $('.position').data('longitude');

來源

2015-10-09 10:36:36 shilovk

在rails視圖中將ruby變量傳遞給javascript函數

回答

相關問題