我的 .html.erb 中的动态 Javascript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6355784/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dynamic Javascript in my .html.erb
提问by willcodejavaforfood
I'm struggling with some Javascript in my first rails application.
我在我的第一个 Rails 应用程序中遇到了一些 Javascript。
Partial: _care_point.html.erb
部分：_care_point.html.erb
<script>
$(function() {
$( ".draggable" ).draggable({grid: [50, 20]});
$( ".node_input").each (function() {
$(this).hide();
});
$("#<%="node.#{care_point.id}" %>").live('dblclick', function(){
console.log('moo');
jQuery(this).hide();
jQuery('.node_input', jQuery(this).parent()).show();
});
});
</script>
<div id=<%="care_point.#{care_point.id}" %> class='draggable node_chin'>
<div id=<%="node.#{care_point.id}" %> class='node'><%= care_point.body %>
</div>
<textarea class='node_input'><%= care_point.body %></textarea>
</div>
This is the output:
这是输出：
<script>
$(function() {
$( ".draggable" ).draggable({grid: [50, 20]});
$( ".node_input").each (function() {
$(this).hide();
});
$("#node.1").live('dblclick', function(){
console.log('moo');
jQuery(this).hide();
jQuery('.node_input', jQuery(this).parent()).show();
});
});
</script>
<div id=care_point.1 class='draggable node_chin'>
<div id=node.1 class='node'>Moo foo
</div>
<textarea class='node_input'>Moo foo</textarea>
</div>
I first added the dblclick event listener classbased, but that caused it to be added multiple times. This made me change it to a id based approach, but now it does not work. Is it because I try to dynamically build up the id?
我首先添加了基于类的 dblclick 事件侦听器，但这导致它被多次添加。这使我将其更改为基于 id 的方法，但现在它不起作用。是因为我尝试动态建立 id 吗？
Is this even the righ place to do this kind of thing?
这甚至是做这种事情的正确地方吗？
采纳答案by Nicola Peluchetti
The problem is here:
问题在这里：
$("#'#node.2'").live('dblclick', function(){
To work it must be:
要工作，它必须是：
$('#node.2').live('dblclick', function(){
i'm no expert of ruby but you must change something here:
我不是 ruby 专家，但你必须在这里改变一些东西：
$(<%="'#node.#{care_point.id}'" %>).dblclick(function(){
I'd try (but i'm guessing - edited)
我会尝试（但我猜 - 已编辑）
$('#<%=node.#{care_point.id} %>').dblclick(function(){
EDIT - Try removing the dots in the ids of th HTML: look at this fiddle http://jsfiddle.net/JeHuD/
编辑 - 尝试删除 th HTML ids 中的点：看看这个小提琴http://jsfiddle.net/JeHuD/
replace
代替
#<%=node.#{care_point.id} %>
with (both in the jquery selector and in the HTML (also consider that your id in the html should have double quotes like this: id="node1")
与（在 jquery 选择器和 HTML 中（还要考虑您在 html 中的 id 应该有这样的双引号：id="node1"）
#<%=node#{care_point.id} %>
FINAL EDIT - in the jquery selector you mustescape dots withdoubole backslashes: here is the updated fiddle that works with the dot http://jsfiddle.net/JeHuD/1/
最终编辑 - 在 jquery 选择器中，您必须使用双反斜杠转义点：这是与点一起使用的更新小提琴http://jsfiddle.net/JeHuD/1/
回答by neebz
Try the following:
请尝试以下操作：
$("#<%="node.#{care_point.id}" %>").live('dblclick', function(){
console.log('moo');
jQuery(this).hide();
jQuery('.node_input', jQuery(this).parent()).show();
});
