在Rails中调用javascript函数onclick

Question

我的一个观点中有以下代码:

<button type="button" onclick="analyze();">Analyze</button>

并且,相应控制器的.js.coffee文件包含

analyze = ->

  $.ajax
    type: "GET"
    url: "http://localhost:3000/api/logs"
    success: (data) ->
      Analytics.doAnalysis data
      return;

  return;

但是,当我单击按钮时,我在控制台中收到一条错误,指出Uncaught ReferenceError:analyze未定义.我认为我的onclick没有正确定义.这样做的推荐方法是什么？

Answer 1

我是网络开发的新手

由于您是新手,请允许我就如何改进代码提供一些建议:

不引人注目的JS(UJS)

本教程非常好地解释了它

Rails惯例适用于"不引人注目的"javascript功能.这意味着您可以分配events到页面上的元素而无需直接引用这些元素(不要使用内联onclick等)

这最好以与CSS相同的方式描述 - 使用inlineCSS是非常费力的,并且被视为不好的做法(事实并非如此DRY).更好的方法是使用中央样式表,然后您可以使用它来设置页面上的元素样式.

不引人注目的Javascript以相同的方式工作 - 将所有内容保存在运行时调用的文件中:

#app/assets/javascripts/application.js
$(".element").on("click", function(){
    ...
});

这一点的重要性不能说得太充分 - 拥有不引人注目的JS是您可以应用的最佳编程模式之一; 它不仅可以破坏您的代码,还可以确保未来的开发可以保持模块化(开发中的黄金标准)

阿贾克斯

由于您使用的是ajax,因此您可能希望使用Rails UJS Ajax功能,这基本上意味着:

<%= button_to "Analyze", analytics_api_path, id: "analyze", remote: true %>

这个remote: true选项调用Rails UJS驱动程序的ajax功能 - 基本上设置一个ajax调用,而不必编写任何代码.需要注意的是,您需要处理自己的ajax:success进程,并且需要将元素指向正确的位置href

我会这样做:

#app/assets/javascripts/application.js.coffee
$("#analyze").on "ajax:success", (data, status, xhr) ->
    Analytics.doAnalysis data

Answer 2

改变这个:

analyze = ->

对此:

window.analyze = ->

默认情况下,coffeescript中的函数不是全局的.