Jquery 未捕获引用错误：$未定义
我在这里看到过类似的问题，但我还没有解决我的问题。我确实尝试过移动我的谷歌托管jQuery文件的CDN链接。我尝试了链接的三个位置-第一个链接源位于head标记的顶部，我还尝试在head标记关闭之前添加它，也尝试在body标记关闭之前添加它，但是我仍然得到未捕获的引用error:$未在控制台中定义。我是jQuery新手，所以任何建议都会有所帮助。我使用的是一个引导主题，这是一个很长的文件，下面是一些基本的内容。我已经在我的文件夹中包括了js/bjqs.min.js和css/bjqs.cssJquery 未捕获引用错误：$未定义,jquery,Jquery,我在这里看到过类似的问题，但我还没有解决我的问题。我确实尝试过移动我的谷歌托管jQuery文件的CDN链接。我尝试了链接的三个位置-第一个链接源位于head标记的顶部，我还尝试在head标记关闭之前添加它，也尝试在body标记关闭之前添加它，但是我仍然得到未捕获的引用error:$未在控制台中定义。我是jQuery新手，所以任何建议都会有所帮助。我使用的是一个引导主题，这是一个很长的文件，下面是一些基本的内容。我已经在我的文件夹中包括了js/bjqs.min.js和css/bjqs.css &l
<!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">
<meta name="description" content="">
<meta name="author" content="">
<title>jQuery Practice</title>
<!--jquery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Include the plugin *after* the jQuery library -->
<script src="js/bjqs.min.js"></script>
<!-- Bootstrap Core CSS - Uses Bootswatch Flatly Theme: http://bootswatch.com/flatly/ -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/freelancer.css" rel="stylesheet">
<link href="css/animate.css" rel="stylesheet">
<!-- Include the basic styles -->
<link type="text/css" rel="Stylesheet" href="css/bjqs.css" />
<!-- Custom Fonts -->
<link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js">
</script>
<![endif]-->
</head>
<body>
<!-- Header -->
<header>
<div class="container">
<div class="row">
<div class="col-lg-12">
<!-- Outer wrapper for presentation only, this can be anything you like -->
<div id="banner-fade">
<!-- start Basic Jquery Slider -->
<ul class="bjqs">
<li><img src="img/banner01.jpg" title="Automatically generated caption"></li>
<li><img src="img/banner02.jpg" title="Automatically generated caption"></li>
<li><img src="img/banner03.jpg" title="Automatically generated caption"></li>
</ul>
<!-- end Basic jQuery Slider -->
</div>
<!-- End outer wrapper -->
<script class="secret-source">
$(document).ready(function() {
$('#banner-fade').bjqs({
height : 320,
width : 620,
responsive : true
});
});
</script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<!-- Plugin JavaScript -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="js/classie.js"></script>
<script src="js/cbpAnimatedHeader.js"></script>
<!-- Contact Form JavaScript -->
<script src="js/jqBootstrapValidation.js"></script>
<script src="js/contact_me.js"></script>
<!-- Custom Theme JavaScript -->
<script src="js/freelancer.js"></script>
</body>
</html>
jQuery实践
$（文档）.ready（函数（）{
$（“#旗帜褪色”）.bjqs({
身高：320，
宽度：620，
回答：对
});
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
其中一个就足够了我看不出您的脚本文件有任何问题。只要确保
- 本地脚本引用实际上存在于本地开发人员站点中
- 您有一个可以访问CDN引用的工作internet连接
- 并确保您是从web服务器运行此页面，而不是直接从文件系统加载它们
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
以防万一。。如果您试图从file://本地测试代码，那么在未定义协议的情况下，脚本将无法加载。。因此，您只需要在该路径上添加一个http:前缀
在运行任何依赖jQuery的代码之前，您可以检查jQuery是否已加载，如果未加载，则先加载；让你知道
if ( typeof jQuery === "undefined" ) {
console.log('loading jquery..');
var script_tag = document.createElement ( 'script' );
script_tag.setAttribute ( "type", "text/javascript" );
//script_tag.setAttribute ( "src", "//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" );
script_tag.setAttribute ( "src", "http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" );
script_tag.onload = result;
script_tag.onreadystatechange = function () {
if ( this.readyState == 'complete' || this.readyState == 'loaded' ) {
result();
}
};
document.getElementsByTagName ( "head" )[0].appendChild ( script_tag );
} else {
result();
}
function result() {
console.log('ready');
}
jQuery(document).ready(function($) {
//your code
});
我将jQuery链接移到了bootstrap.min.js行上方的jsp页面顶部，它成功了。下面这些行的放置顺序很重要，因为需要首先加载jQuery js。我将jQuery放在页眉中，将引导放在页脚中，这样就有足够的时间让它加载所有内容
<script src="jquery/jquery.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
src/http://https://文件：http:文件：