简体   繁体   English

如何在外部.js文件中使用jquery?

[英]How to use jquery in a external .js file?

In my website, there include such 2 files: index.php, script.js Of course, it is much more complicated in the web site and the above only shows a part of it. 在我的网站上,有两个文件:index.php,script.js当然,它在网站中要复杂得多,上面仅显示了一部分。

In index.php, there is a div element 在index.php中,有一个div元素

<div id="phb29" class="drag ph hour01">Testing</div>

In script.js,which is a pure javascipt file,below show a part that i want to use a jquery function .switchClass() (from http://api.jqueryui.com/switchClass/ ) to switch the class of div element. 在script.js(这是一个纯javascipt文件)中,下面显示了我要使用jquery函数.switchClass()(来自http://api.jqueryui.com/switchClass/ )来切换div元素类的部分。

//... other normal js codes

switchClassHour = function(){

    $(function (){       
            $( "#phb29" ).switchClass( "hour01", "hour03", 1000 );
                return false;
        });     
}

//other normal js codes...

I only want to call that jquery when I call the switchClassHour() function but not the web page is loaded(ie $(document).ready(function (){...}); ) 我只想在调用switchClassHour()函数时调用该jquery,但未加载网页(即$(document).ready(function(){...});)

I have included the source in the in index.php: 我已经将源代码包含在index.php中:

<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript" src="script.js"></script>

But finally, the chrome browser gives me this error occurring at the line $(function (){ when I trigger switchClassHour(): 但是最后,当我触发switchClassHour()时,chrome浏览器给我这个错误发生在$(function(){)行:

Uncaught TypeError: boolean is not a function 

What should I do, thank you !!!!! 我该怎么办,谢谢!!!!! :):) :) :)

function switchClassHour(){
    if(document.getElementById('jq')){
        //original switchClassHour() code. 
    }
    else{
        var jq = document.createElement('script');
        jq.src = "WHATEVER SOURCE YOU WANT TO LOAD FROM (PROBABLY GOOGLE)";
        jq.id = "jq";
        document.getElementsByTagName('head').item(0).appendNode(jq);
        //Original switchClassHour() code
   }
}

I don't know if this is guaranteed to work since I don't know if you'll be able to load jQuery fast enough to call your function immediately afterwards. 我不知道这是否一定能正常工作,因为我不知道您是否能够足够快地加载jQuery以随后立即调用您的函数。 If this doesn't work because jQuery isn't loading fast enough then the only outcome I could see is adding a delay but that's ugly. 如果由于jQuery加载速度不够快而导致此方法不起作用,那么我能看到的唯一结果就是增加了延迟,但这很丑陋。 To be honest if you're using jQuery I would just load it from Google normally in the <head> of your page. 老实说,如果您使用的是jQuery,我通常会在页面的<head>中从Google正常加载它。 Most people have it cached already. 大多数人已经缓存​​了它。

The variable toHour does not appear to be defined within the function switchClassHour . 变量toHour似乎没有在switchClassHour函数中switchClassHour

Try this 尝试这个

switchClassHour = function(){
/* `toHour` ? */
  if (window.jQuery) {
    /* $(function (){  */     
            $( "#phb29" ).switchClass( "hour01", "hour03", 1000 );
                /* `return false;` ? */
    /*    }); */
  };    
};
switchClassHour(); /* just noticed, is the function actually called ? */

Edit 编辑

Try this 尝试这个

   switchClassHour = function(){
    /* `toHour` ? */
      if (window.jQuery) {
        /* $(function (){  */     
                console.log($.now())
                    /* `return false;` ? */
        /*    }); */
      };    
    };
    switchClassHour();

Is $.now() return'ed at console? $.now()是否在控制台返回?

Is $ utilized in other parts of non-jquery pieces? $是否可用于非jquery片段的其他部分?

See also https://api.jquery.com/jQuery.noConflict/ 另请参阅https://api.jquery.com/jQuery.noConflict/

Edit 编辑

Try this 尝试这个

switchClassHour = function() {
  jQuery.noConflict();
    (function( $ ) {
     console.log($.now(), jQuery.now())
  })(jQuery);
};switchClassHour();

Hope this helps 希望这可以帮助

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM