Menu
I'm trying to use the iCheck plugin and I'm new to JQuery and javaScript. I'm getting an error in the browser that says
TypeError: $ is undefined
I looked around and found this link, but I tried adding (jQuery) as it suggests, but it didn't change the error message.
The symptom on the web page that I see is that the web page doesn't have hover working or black inside the checkbox, like the example for polaris skin shows.
Any ideas? See the " c-style comment - //" below to know the exact line that the TypeError is pointing to.
Here is an excerpt from my code:
<html>
<head>
<title>jQuery Michele Project</title>
<link href="css/skins/polaris/polaris.css" rel="stylesheet">
<link href="css/skins/all.css" rel="stylesheet">
<link href="css/demo/css/custom.css" rel="stylesheet">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="js/icheck.js"></script>
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
<script type="text/javascript" src="js/jquery.ui.core.js"></script>
<script type="text/javascript" src="js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="js/jquery.ui.accordion.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#infolist").accordion({
autoHeight: false
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$('.input').iCheck({
checkboxClass:'icheckbox_polaris', //this is the line that the error message points to
radioClass:'iradio_polaris',
increaseArea:'-10%'
});
})(jQuery);
</script>
<style type="text/css">
ul {list-style-type: none}
img {padding-right: 20px; float:left}
#infolist {width:500px}
</style>
</head>
<body>
467
Luckily, this is a simple fix. Simply change the order in which the files are loaded—that is, place jQuery above your source file, and then try to execute the code once more. Your code should work and the console shouldn't be displaying any errors.
Common causes of 'jQuery is undefined'Incorrect load order of JavaScript assets. jQuery source can't be loaded/found. Conflicting plugins/libraries/code. Framework implementation issues.
A variable that has not been assigned a value is of type undefined . A method or statement also returns undefined if the variable that is being evaluated does not have an assigned value. A function returns undefined if a value was not returned .
Undefined means that a variable has been declared but has not been assigned a value. In JavaScript, properties and functions can only belong to objects. Since undefined is not an object type, calling a function or a property on such a variable causes the TypeError: Cannot read property of undefined .
You are loading <script src="js/icheck.js"></script> before jQuery is defined. Load jQuery first.
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
<script type="text/javascript" src="js/jquery.ui.core.js"></script>
<script type="text/javascript" src="js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="js/jquery.ui.accordion.js"></script>
<script src="js/icheck.js"></script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
