1

Im building a page using Bootstrap and still feeling my way around. Im trying to load content to a div once the page has finished loading and Im using jQuery .load method. For some reason it always comes back as : load is not a function, even when Ive copied a working example from w3schools.

My code is as follows:

$(document).ready(function(){
$(".carousel-load").load('HTML/avaleht.html');
 })
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink- 
to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="CSS/bootstrap.min.css" >
<link rel="stylesheet" href="CSS/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
</script>
<title>ASMRi</title>



</head>

<div class="carousel-load"></div>

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
 </body>
</html>

Any sort of help is much appreciated!

Sandesh Gupta
  • 1,175
  • 2
  • 11
  • 19
Rikas
  • 23
  • 1
  • 6

1 Answers1

3

You're including jQuery two times in your code, and the latter (slim version) doesn't include load() function in it. Since the latter also overrides the former, you get this error.

You need to remove this line from the code:

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>

To see the difference between the two flavors, this post is a good start.

31piy
  • 23,323
  • 6
  • 47
  • 67
  • Thank you very much. I knew bootstrap needed jquery but didnt even pay attention that the one on the bottom of the body was slim. Works a treat now. Thanks! – Rikas Apr 29 '18 at 06:26