将JQuery getJSON与其他随附的JavaScript结合使用可产生ReferenceError [英] Using JQuery getJSON with other JavaScripts included gives ReferenceError

问题描述

我制作了一个小的HTML页面示例，以使JQuery的getJSON方法正常工作.看起来像下面(抱歉，太草率，这只是概念证明，以后再添加到更大的项目中):

I made a small example HTML page to get JQuery's getJSON method working. It looks like below (sorry for the sloppiness, this was just a proof of concept to then later add into a larger project):

<script type="text/javascript">

function test() {   
$.getJSON("http://api.flickr.com/services/rest/?&method=flickr.people.getPublicPhotos&api_key=e999b3a5d47d013b780e8ac255c86266&user_id=24579658@N03&format=json&jsoncallback=?",    
                function(data){
                      $.each(data.photos.photo, function(i,photo){
     $("<img/>").attr("src", "http://farm5.static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret + ".jpg").appendTo("#images2");
    //alert();
        if ( i == 6 ) return false;
      });
});

}

然后使用

<script type="text/javascript">

                            $(function() {
                                $("#yo").click(test);
                            });
    </script>

这在一个项目中运行良好，在该项目中，我包括的唯一JS是JQuery，并且这是唯一的功能.但是，一旦将其添加到其他项目中，就会遇到错误.另一个项目包含一些我认为可能一直在做的mootools库.但是，即使完全删除了mootools内容并仅使用了jquery内容，我仍然收到以下错误:

This worked fine in a project where the only JS I included was JQuery and these were the only functions. However, once I added it to my other project, it through errors. The other project has some mootools libraries included which I thought might've been doing it. However, even after completely removing the mootools stuff and just using this jquery stuff, I still get the error below:

ReferenceError:未定义$

ReferenceError: $ is not defined

我确实包含其他Java脚本，例如google脚本和我编写的其他Java脚本，但是它们不使用JQuery或Mootools.谁能解释为什么我会收到此错误?

I do have other javaScripts included such as a google one and some other ones I've made, but they don't use JQuery or Mootools. Can anyone explain why I'd be getting this error?

推荐答案

听起来，您带来的某些其他代码似乎未定义$符号.实际上，您可能已经包含了一些调用jQuery的noConflict函数的代码，该函数专门取消了$的定义.

It certainly sounds as if some of the additional code you have brought in has undefined the $ symbol. In fact, it is possible you have included some code that calls jQuery's noConflict function, which specifically undefines $.

jQuery本质上是这样定义的:

jQuery, in essence, defines it like this:

$ = jQuery;

这意味着您可以将代码中的$符号替换为"jQuery"，例如:

That means that you could replace the $ symbol in your code with "jQuery," for example:

jQuery.getJSON(...

或

jQuery(function() {
    jQuery("#yo").click(test);
});

当然，$符号快捷方式当然很方便.放弃它是很可惜的，因此您可以重新定义它以再次代表"jQuery".但是，您不希望它破坏任何其他非jQuery JavaScript，因此重建$快捷方式的安全方法是将所有自己的代码包装在闭包中.每个闭包函数的唯一参数将是"$"，传递给每个闭包的参数将是"jQuery".例如:

Of course, the $ symbol shortcut certainly is handy. It would be a shame to give that up, so you could redefine it to stand in for "jQuery" once again. You would not want it to break any of your other, non-jQuery JavaScript, though, so the safe way to reestablish the $ shortcut would be to wrap all of your own code in closures. The lone parameter to each closure function would be "$" and the argument passed to each closure would "jQuery." For example:

(function($) {
        function test() {   
            $.getJSON("http://api.flickr.com/services/rest/?&method=flickr.people.getPublicPhotos&api_key=e999b3a5d47d013b780e8ac255c86266&user_id=24579658@N03&format=json&jsoncallback=?",    
                        function(data){
                              $.each(data.photos.photo, function(i,photo){
             $("<img/>").attr("src", "http://farm5.static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret + ".jpg").appendTo("#images2");
            //alert();
                if ( i == 6 ) return false;
              });
        });
})(jQuery);

请注意，匿名函数闭包具有参数$，因此在整个函数内部，$将具有您传递给匿名函数的值.接下来，请注意，在函数定义的最后，我们立即调用刚刚定义的函数，并将jQuery作为参数传递.这意味着在闭包内部，但是在闭包内部，只有 ，$现在是jQuery的快捷方式.

Notice that the anonymous function closure has the parameter $, so inside the entire function the $ will have the value you pass to the anonymous function. Next, notice that at the end of the function definition, we immediately invoke the function we have just defined and we pass jQuery as the argument. That means that inside the closure, but only inside the closure, $ is now a shortcut for jQuery.

最后一点，您可以通过调用jQuery.noConflict()来有意关闭jQuery对$符号的使用(请参阅

One final note, you can deliberately turn off jQuery's use of the $ symbol by calling jQuery.noConflict() (see http://api.jquery.com/jQuery.noConflict/). If you will be using other JavaScript code beyond just your code and jQuery, it is a good idea to call that function after you have loaded all of your JavaScript files, then use the closure technique described above, so that you can safely continue to the $ shortcut in your own code.

这篇关于将JQuery getJSON与其他随附的JavaScript结合使用可产生ReferenceError的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！