参考错误:$ 未定义

IT技术 javascript jquery html
2021-01-29 15:39:59

我有这个错误信息ReferenceError: $ is not defined
这是我的标题。

<link href="css/global-style.css" rel="stylesheet" type="text/css" media="screen">
<link rel="stylesheet" type="text/css" media="screen" href="css/datepicker3.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/bootstrap-datepicker.js"></script>

以下是我的 JavaScript 代码

<script type="text/javascript">
$('#sandbox-container .input-daterange').datepicker({
    startDate: "today",
    calendarWeeks: true,
    todayHighlight: true
});
</script>

以下是 HTML

<div class="col-md-12" id="sandbox-container">
    <label>Project Duration</label>
    <div class="input-daterange input-group" id="datepicker">
            <input type="text" class="input-md form-control" name="start" />
            <span class="input-group-addon">to</span>
            <input type="text" class="input-md form-control" name="end" />
    </div>
</div>

我想在输入标签上显示日期选择器。
我正在使用 Bootstrap V3.1。
我正在使用这个日期选择器

6个回答

在使用 $ 或 jQuery 的脚本之前添加 jQuery 库以便可以在脚本中识别 $。

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

使用 Google CDN 进行快速加载:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
能否请您显示您的标题,以便我可以准确了解引导程序和 jquery 的版本。
2021-03-20 15:39:59
code.jquery 使用 maxcdn,它与谷歌的 CDN 一样快(至少在正常用例中),并且 code.jquery 也是推荐的方式。
2021-03-26 15:39:59
您还需要添加 ui 以支持日历。
2021-04-06 15:39:59
我正在使用 jQuery v2.0.3。我添加了我的标题
2021-04-08 15:39:59

在 head 标签中添加这个脚本:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

这是每个人在使用 jQuery 时都会犯的常见错误之一,基本上 $ 是 jQuery() 的别名,因此当您在声明函数之前尝试调用/访问它时,最终会抛出此错误。

原因可能是

1) 您包含的 jQuery 库的路径不正确。

2)在脚本之后添加了库,你看到了那个错误

为了解决这个

在所有 javascript 文件/脚本的开头加载 jquery 库。

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>

jQuery 是一个 JavaScript 库,jQuery 的目的是让代码更容易使用 JavaScript。

jQuery 语法是为选择而定制的,$定义/访问 jQuery 的标志。

它的声明序列必须在上面,然后包含使用 jQuery 的任何其他脚本

jQuery 声明的正确位置:

$(document).ready(function(){
    console.log('hi from jQuery!');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>

上面的示例将完美运行,因为 jQuery 库在使用 jQuery 函数的任何其他库之前初始化,包括 $

但是如果你把它应用到其他地方,jQuery 函数将不会在浏览器 DOM 中初始化,也无法识别任何与 jQuery 相关的代码,并且它的代码以$符号开头,因此你会收到$ is not a function错误消息。

jQuery 声明的位置不正确:

$(document).ready(function(){
    console.log('hi from jQuery!');
});
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

上面的代码将不起作用,因为 jQuery 没有在任何使用 jQuery 就绪函数的库的顶部声明。