ReferenceError:$未定义

Question

我有这个错误消息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>

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

Answer 1

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

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

Answer 2

使用Google CDN进行快速加载:

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

Answer 3

在head标签内添加此脚本:

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

Answer 4

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

原因可能是

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

2）在脚本后添加库，如果您看到该错误

为了解决这个问题

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

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