jquery - 如何从同一视图文件夹中的 js.erb 文件调用我的 html.erb 文件中的 jquery 函数

Question

我有一个在页面加载时运行的绘图功能，html.erb file摘录如下：

<div class="canvasarea">
<canvas id="myCanvas" width="360" height="840"></canvas>
</div>

<script> 
//definition of vars used in draw function...

 window.onload = function() {
    window.setTimeout(drawSomething,500)
  };

  function drawSomething() {
    context.drawImage(imageObj, xOffset, yOffset);
  }  
 </script>

当在页面上按下按钮时，我想重绘此图像。该按钮位于 html.erb 文件中。它目前取代了一些trs。我想在drawSomething()按下按钮时调用该函数。.js.erb file: _

<% @pos_range.each do |p|%>
    $("td#add_foo_<%= p %>").replaceWith("<%= escape_javascript(render(:partial => 'bars/update_foo_position', :locals => { :id => @foo.id, :position_str => @position_str, :position => p} ))%>");
    <% if (@foo and p == @foo.position) or @pos_range.length == 1 %>
        $("td#add_foo_button_<%= p %>").replaceWith("<%= escape_javascript(render(:partial => 'bars/update_foo_position_button', :locals => { :id => @bar.id, :position_str => @position_str, :position => p} ))%>");
    <% else %>
        $("td#add_foo_button_<%= p %>").replaceWith("<%= escape_javascript(render(:partial => 'bars/update_foo_position_empty', :locals => { :id => @bar.id, :position_str => @position_str, :position => p} ))%>");
    <% end %>
<% end %>

<% if @foo%>
    $("#tr_<%=@foo.name %>").hide()
<% end %>
$("#dialog").dialog("close").remove();

Answer 1

简单的 javascript

var button = document.getElementById("yourbuttonid");
button.addEventListener("click", drawSomething, false);

或者jquery语法

$("#yourbuttonid").on("click",function(){
    drawSomething();
});

Answer 2

如果您希望在替换元素并关闭对话框后调用该函数，您应该能够简单地将其添加到js.erb文件末尾：

drawSomething();