The common reason for this error behind is Uncaught ReferenceError: $ is not defined executing jquery code before loaded jQuery library file or not imported jQuery CDN in your file.
Basically $ is the jQuery alias so when you try to call or access it before declaring the function. it will end up with throw $ is undefined.
Solutions
You must need to push the reference to the jquery script first.
If you can't follow the sequence, So the jquery code loaded first and then the jquery library, because of this jquery code is not able to read without jquery library file.
<script language="JavaScript" type="text/javascript" src="/js/jquery-1.2.6.min.js"></script> <script language="JavaScript" type="text/javascript" src="/js/jquery-ui-personalized-1.5.2.packed.js"></script> <script language="JavaScript" type="text/javascript" src="/js/sprinkle.js"></script>
If you are using the ajax form, You just need to import the ajax library.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Have you imported the jQuery library?
// Import It Before run your jQuery code <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Webappfix</title>
</head>
<body>
<h1>Hello</h1>
// Import It Before run your jQuery code
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(function() {
alert();
})
</script>
</body>
</html>
We always thanks to you for reading our blogs.
Dharmesh Chauhan
(Swapinfoway Founder)Hello Sir, We are brothers origin from Gujarat India, Fullstack developers working together since 2016. We have lots of skills in web development in different technologies here I mention PHP, Laravel, Javascript, Vuejs, Ajax, API, Payment Gateway Integration, Database, HTML5, CSS3, and Server Administration. So you need our service Please Contact Us
Haresh Chauhan
(Co-Founder)We Are Also Recommending You :
- Laravel 6 installation with Angular
- AngularJS Login Logout with Laravel 6
- Skeleton Screen Loading Effect
- How To Create Routing In VueJs
- How to Add Bootstrap in Angular 8 | Install Bootstrap 4 in Angular 8
- Select2 ajax example
- Laravel 9 Ajax Image Upload With Preview Tutorial
- Axios API Response Status Code Best way To Handle In Vue
- Jquery - notification popup box using toastr JS Plugin
- Laravel 9 Ajax Login Form Submit With Validation Handled