Checking If Jquery Is Loaded Using JavaScript

Checking if jquery is loaded using Javascript

something is not right

Well, you are using jQuery to check for the presence of jQuery. If jQuery isn't loaded then $() won't even run at all and your callback won't execute, unless you're using another library and that library happens to share the same $() syntax.

Remove your $(document).ready() (use something like window.onload instead):

window.onload = function() {
if (window.jQuery) {
// jQuery is loaded
alert("Yeah!");
} else {
// jQuery is not loaded
alert("Doesn't Work");
}
}

check if jquery has been loaded, then load it if false

Maybe something like this:

<script>
if(!window.jQuery)
{
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "path/to/jQuery";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>

Check if jQuery has loaded with Javascript

You can use window.jQuery to validate if jQuery has been loaded or not

function AddExternals(){
if (!window.jQuery){
var jq = document.createElement("script");
jq.type = "text/javascript";
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js";
document.getElementsByTagName("head")[0].appendChild(jq);
console.log("Added jQuery!");
} else {
console.log("jQuery already exists.")
}
}

AddExternals();

WORKING DEMO

Note: According to js convention pascal case is used when it is a constructor function .For example

var adder = new Function('a', 'b', 'return a + b'); 

How can I check if jquery is loaded from external JS file?

When you add the jquery file using the script.it would not available so you have to add onload listener to detect the when it's available.

function fnjquery() {
$('#test').click( function() {

alert('clicked');

});
}

if(typeof jQuery=='undefined') {
var headTag = document.getElementsByTagName("head")[0];
var jqTag = document.createElement('script');
jqTag.type = 'text/javascript';
jqTag.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js';
jqTag.onload = fnjquery;
headTag.appendChild(jqTag);
} else {
fnjquery();
}

The best way to know if JQuery is available?

if (typeof jQuery === 'undefined') {
// jQuery is NOT available
} else {
// jQuery is available
}

How to test if jquery is loading properly?

First:

test the link to jQuery. You're using Goole's CDN so you can pop that link right into the browser. BTW it works fine.

https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js

Second:

Firebug, just open the console and type in '$().jquery' without the quotes... if jQuery is loaded it will spit out a version number otherwise it will spit out an error.

Third

Check your ID & Classes in HTML, CSS & JS. For certain you have some broken CSS on your carousel container which is probably screwing things up. I took the CSS below right from your markup and you can see that '#container carousel' should be '#container #carousel'. Without that I don't think anything is going to move.

 #container carousel {
position: relative;
width: 100%;
margin: 0 auto;
}

How to detect if jquery has finished loading using javascript

One option would be to put the script tag at the end of the body, or:

(function() {
function getScript(url,success){
var script=document.createElement('script');
script.src=url;
var head=document.getElementsByTagName('head')[0],
done=false;
script.onload=script.onreadystatechange = function(){
if ( !done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete') ) {
done=true;
success();
script.onload = script.onreadystatechange = null;
head.removeChild(script);
}
};
head.appendChild(script);
}
getScript('http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js',function(){
// YOUR CODE GOES HERE AND IS EXECUTED AFTER JQUERY LOADS
});
})();

From this answer: https://stackoverflow.com/a/5853358/1766140



Related Topics



Leave a reply



Submit