Why Is Jquery Not Working With Bootstrap 4 Alpha 6?
I am attempting to use jQuery and it is giving me various errors. I tried shuffling different script tags around, but had no success. Here is some code:
Solution 1:
Your problem is not related with bootstrap, you are adding jQuery dependent script before it's loaded. Add your script after jQuery and use $(document).ready(), .load() is deprecated. https://api.jquery.com/load-event/
.intro{
width: 200px;
height: 200px;
background: purple;
display: none;
}
.welcomeSize{
width: 200px;
height: 200px;
background: violet;
display: none;
}<!DOCTYPE html><html><head><metacharset="utf-8"><metaname="viewport"content="width=device-width"><title>JQuery+Bootstrap</title></head><body><!DOCTYPE html><htmllang="en"><head><metacharset="utf-8"><metaname="viewport"content="width=device-width, initial-scale=1, shrink-to-fit=no"><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ"crossorigin="anonymous"></head><body><divclass="intro"></div><divclass="welcomeSize"></div><scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb"crossorigin="anonymous"></script><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn"crossorigin="anonymous"></script><script>if(jQuery){
console.log('yes');
}
$(document).ready(function(){
$('.intro').fadeIn(500, function(){
$(".welcomeSize").fadeIn(500);
});
});
</script></body></html></body></html>Solution 2:
you have to import jquery before write any code using jquery so what you have to do is
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
// then your code goes here
the second thing for Uncaught TypeError: a.indexOf is not a function
you should use $(window).on('load', function() { ... });
instead of
$(window).load(function() { ... });
load, .unload, and .error, deprecated since jQuery 1.8, are no more. Use .on() to register listeners.
Solution 3:
Note that you've been using the jQuery commands before linking the script. The script tag which source(src) attribute is pointing to Google CDN must come before the jQuery command.
Post a Comment for "Why Is Jquery Not Working With Bootstrap 4 Alpha 6?"