javascript - 添加 JQuery 时出错

Question

我将 JQuery 添加到我的 HTML 文件中：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 

然后我添加一个指向我的 JavaScript 文件的链接：

<script src="public/javascripts/new_javascript.js" type="text/javascript"></script> 

（我检查了这个链接是否有效。）

在我做的文件中

$(document).ready(function() {
   alert("hey!");
});

但是谷歌浏览器开发者工具显示错误：

Uncaught TypeError: Object #<HTMLDocument> has no method 'ready'

怎么可能是错误？

我在 Rails 中这样做，HTML 就像：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>   
<script src="public/javascripts/prototype.js?1349898477" type="text/javascript"></script> 
<script src="public/javascripts/effects.js?1349898477" type="text/javascript"></script> 
<script src="public/javascripts/dragdrop.js?1349898477" type="text/javascript"></script> 
<script src="public/javascripts/controls.js?1349898477" type="text/javascript"></script> 
<script src="public/javascripts/rails.js?1349898477" type="text/javascript"></script> 
<script src="public/javascripts/application.js?1349898477" type="text/javascript"></script> 
<script src="public/javascripts/new_javascript.js?1351137775" type="text/javascript"></script> 

Answer 1

jQuery 和 Prototype 相互冲突。尝试使用 jQuery 而不是 $ 用于 jquery 命令：

jQuery(document).ready(function() {
   alert("hey!");
});

Answer 2

如果原型仍然像黑暗时代一样覆盖 $，请将您的 JQ 代码包装在一个函数中，如下所示：

(function($) {

    // Do whatever you like with $

    $(function() {
        alert("Document ready");
    })

})(jQuery);

Answer 3

您可以使用jQuery.noConflict()

$.noConflict();
jQuery(document).ready(function($) {
    // Code that uses jQuery's $ can follow here.
});
// Code that uses other library's $ can follow here.