Hi guys! my HTML slider with JS isn’t working. You can see the pen here.
It shows an error which is “Uncaught ReferenceError: $ is not defined”.
It will be great if you guys help me out!
Hey,
You’re using jQuery, but haven’t added it to your pen. $ is shortcut for jQuery
how can I add jquery to my pan and also in .js file?
Codepen:
Settings=>js =>search CDN type jquery
You mean you want to add it locally?
I mean how can i make it work? I know a little about it. If you kindly tell me what exactly should i do it will be great!
-
if you want to make it work on Codepen
Using JavaScript Libraries
(jQuery is a javascript library) -
if you want to use it locally (project on you PC/laptop) add CDN link to your
index.html
before closing body tag
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
//you code here
//add jquery CDN
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
AND your script (js code)
<script>
$(document).ready(function(){
document.write("Hello, World!");
});
</script>
//or link to local file with your js code e.g. if it's in the same folder where your index.html is
<script src="my_script.js"></script>
</body>
</html>
Hope this helps, if not, please tell me what exactly you don’t understand
Thanks @Annestezia, It’s working in codepen but in my local environment it isn’t working:
scripts in html file:
scripts codes same as codepen(which is working fine):
But it shows error:(for your convenience I have hosted these HTML file and
js files in here
I hope you would fix this problem.
there’s a typo it your input id in .html it’s budgeT
1 Like