简单的 jQuery 在 Rail 3.2 中不起作用

Question

这个已经让我走了几个小时了。任何帮助将不胜感激，如果我可以提供更多信息，请告诉我。

我正在尝试在我的 Rails 3.2 应用程序中使用一些基本的 jQuery。有问题的 jQuery 是在按下按钮时提供一个动作（目前，只是一个提醒对话框知道它正在工作）。

app/views/orders/index.html.erb

...

<button type="button" class="btn" id="button">My button</button>

...

我已经为 jQuery/JS 代码尝试了多种变体，包括...

apps/assets/javascripts/orders.js

$('#button').click(function() {
    alert("Test message");
});

.

$(document).ready(function() {
    $('#button').click(function() {
        alert("Test message");
    });
});

.

$(document).ready(function() {
    $('#button').button();
    $('#button').click(function() {
        $(this).button('loading');
    });
});

需要注意的几点：

• 这是在开发环境中运行的
• JS 文件显示在源代码和 Chrome 网络/资源面板中，没有错误。
• 我已尝试重新排序我的 application.js 文件。
• 我还不擅长 CoffeeScript，但愿意尝试基于 CoffeeScript 的解决方案。
• Chrome 在 Morris 中报告错误。

我的app/assets/javascripts/application.js供参考

//= require jquery
//= require jquery_ujs
//= require raphael
//= require morris
//= require bootstrap
//= require_tree .

任何有关采取步骤追踪此错误的建议都会非常有帮助！

---

更新

尝试了以下 CoffeeScript 解决方案，但没有成功。

jQuery ->
    jQuery('#button').click ->
        alert("Test msg")

// ... which generates ...

(function() {

  jQuery(function() {
    return jQuery('#jamcake').click(function() {
      return alert("You have cake?");
    });
  });

}).call(this);

尝试将按钮更改为链接，但无济于事。

尝试回归基础，以下工作。

alert("Hello");

但是，以下不...

$(document).ready(function() {
    alert("Hello there");
});

Answer 1

在黑暗中拍摄，但其他 js 库之一可能与 jQuery 对 $ 的使用发生冲突

试试：

jQuery(document).ready(function($) {
  // code here, using $ as usual

  $('#button').click(function() {
    alert("Test message");
  });
});

Answer 2

.html

<button type="button" class="btn" id="first-test">My button</button>

.js

$(function() {
   $("button#first-test").on("click",function() {     
     alert(hi); 
   });            
});

Answer 3

试试这个并检查控制台以确保：事件正在触发并且 jQuery 可以找到该元素。

$(document).ready(function() {
    console.log($('#button').size());
});

如果您一无所获，您可能会遇到冲突，或者其他库的错误会阻止脚本的其余部分运行。