javascript - Rails 3-如何动态创建与param [:id]相关联的html元素？

我正在尝试实现需要使用html5绘图 Canvas 的Rails 3应用程序。

到目前为止，我有一个Sketch脚手架，并且我将索引和显示 View 修改为并排(我在其中键入了隐藏的 div ，只是为了表明我打算将 Canvas 托管在div):

当前在 application.js 文件中，我有一个脚本，该脚本可通过Ajax请求访问show Action 并将其放置在Sketches列表旁边。这是该代码:

//  Show individual sketch
$(function(){
  var $sketch_div = $('#show_sketch_div');

  // return html instead of js
  $('a[data-remote]').live('ajax:beforeSend', function(e, xhr, settings){
    xhr.setRequestHeader('accept', '*/*;q=0.5, text/html, ' + settings.accepts.html);
  });

  // Handle sketch name links with the data-remote attribute
  $('a[data-remote]').live('ajax:success', function(xhr, data, status){
    $sketch_div
      .html(data)
      .show();
  });
});

另外，“草图”列表中的每个链接都有一个与之关联的类(以便使用JQuery进行抓取):

<td><%= link_to 'Show', sketch, :remote => true, :class => 'show_sketch_button' %></td>

我已将Sketch Controller 设置为呈现JSON:



这部分是我真正被卡住的地方。

我计划每当单击Sketch的显示按钮时，就使用JQuery插入Canvas标签。但是，我不知道如何使用Javascript获取关联草图的 id 参数，然后使用该参数生成仅与该特定 id 相关联的Canvas元素。

我已经搜索了JSON教程，但找不到任何能解决我要解决的问题的东西。我对JSON也很陌生-所以我可能会错过它。

有没有人有任何想法或例子可以指出？

最佳答案

如果我是对的，您想将素描对象的ID写入html，以便以后在JavaScript中使用。

在您的link_to标记中创建一个“data-” html5属性。在html5中，您可以创建以“data-”开头的标签，这些标签将有效。

<%= link_to 'Show', sketch, :remote => true, :class => 'show_sketch_button', :"data-sketch-id" => sketch.id %>

在jQuery中，您可以使用$('a.show_sketch_button[data-sketch-id="<NUMBER>"]')获得此元素

顺便说一句，我不建议使用.live事件处理。每次更改时，它都会解析完整的DOM。相反，如果需要删除事件处理程序，则只需使用.bind()、. unbind()