我有一个像这样的 block :
- competitors.each do |competitor|
%dl
%dt
...
%dd
%span{:id => "#{competitor['watchers']}"}= "#{((competitor['watchers']*100.0)/30000).round.to_f}%"
注意它生成动态 CSS id,每个 block clicle 一个,结果 html 是不同 dd --> span --> id 编号的列表:
<dl>
<dt>
...
<dd>
<span id="774">93.0%</span>
</dd>
</dt>
</dl>
<dl>
<dt>
...
<dd>
<span id="13774">46.0%</span>
</dd>
</dt>
</dl>
我想“动态地”将“自定义 CSS 片段”关联到不同的 css id (#13774 #774),例如:
:javascript
$("##{competitor['watchers']}").css({ width: "#{((competitor['watchers']*100)/30000)}px" });
如何在没有 link_to 类助手的情况下调用 ajax(在 Rails 3.2.3 ':remote => true' 中)?
直到现在我都尝试从内部 block 调用 JS,例如:
- competitors.each do |competitor|
:javascript
$("##{competitor['watchers']}").css({ width: "#{((competitor['watchers']*100)/30000)}px" });
%dl
%dt
...
%dd
%span{:id => "#{competitor['watchers']}"}= "#{((competitor['watchers']*100.0)/30000).round.to_f}%"
但它不起作用,代码永远不会注入(inject)到 DOM 中。
最佳答案
看起来您正在尝试显示某种条形图,在这种情况下,我会建议以下内容(我假设您使用的是 jQuery,因为这就是标记的内容):
更改您的 block 以向每个跨度添加一个唯一的类。这会给你以后的风格带来好处。
%dd
%span{:id => "#{competitor['watchers']}", :class => "progress-bar"}= "#{((competitor['watchers']*100.0)/30000).round.to_f}%"
然后您应该能够在页面底部使用一些 jQuery 来选择每一个,并对其进行一些基本的数学运算:
$('span.progress-bar').each(function(index,element){
var num = $(element).attr('id'); // get element id
var width = parseInt(num * 100 / 30000); // do your math, then get the integer value for width
$(element).css('width',width+'px'); // set width
}
我知道您正在寻找 ajax,但除非我遗漏了什么,否则这应该接近于解决您记录的问题。
关于javascript - 如果没有 "link_to"类助手,我如何调用 ajax?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10396933/