Javascript “错误”；未捕获类型错误：$（…）。datetimepicker不是函数；_Javascript_Jquery_Datetimepicker

Javascript “错误”；未捕获类型错误：$（…）。datetimepicker不是函数；

javascript jquery

Javascript “错误”；未捕获类型错误：$（…）。datetimepicker不是函数；,javascript,jquery,datetimepicker,Javascript,Jquery,Datetimepicker,我试图显示两个datetimepicker，但得到错误“UncaughtTypeError:$（…）。datetimepicker不是函数”。我安装了：安装包Bootstrap.v3.Datetimepicker 安装包Bootstrap.v3.Datetimepicker.CSS 代码如下： @model MVCGreenhouseMonitoring.Models.Plotting.PlottingCalendarDropDownList <head> <tit

我试图显示两个datetimepicker，但得到错误“UncaughtTypeError:$（…）。datetimepicker不是函数”。我安装了：

安装包Bootstrap.v3.Datetimepicker

安装包Bootstrap.v3.Datetimepicker.CSS

代码如下：

@model MVCGreenhouseMonitoring.Models.Plotting.PlottingCalendarDropDownList
<head>
    <title></title>
    <script src="~/Scripts/jquery-1.9.1.js"></script>
    <script src="~/Scripts/jquery-ui-1.11.4.min.js"></script>
    <script src="~/scripts/moment-with-locales.min.js"></script>
    <script src="~/scripts/bootstrap.min.js"></script>
    <script src="~/scripts/bootstrap-datetimepicker.js"></script>
    <link rel="stylesheet" href="~/Content/bootstrap-datetimepicker.css" />

</head>
<script>
    $(function () {
        $("#txtdatepicker1").datetimepicker();
        $("#txtdatepicker2").datetimepicker();
    });
</script>

@using (Html.BeginForm("IntervalReports", "Greenhouse", FormMethod.Post))
{
    <table>
        <tr>
            <td>
                <p>
                    Start Date: @Html.TextBoxFor(m => m.StartDateCalendar, new { @id = "txtdatepicker1", @style = "width:200px;" })
                </p>
            </td>
            <td>
                <p>
                    End Date: @Html.TextBoxFor(m => m.EndDateCalendar, new { @id = "txtdatepicker2", @style = "width:200px;" })
                </p>
            </td>
        </tr>
    </table>
    <input type="submit" name="btnSubmit" value="Submit" />
}

@model mvcgreenhouse monitoring.Models.Plotting.Plotting日历下拉列表
$（函数（）{
$（“#txtdatepicker1”）.datetimepicker（）；
$（“#txtdatepicker2”）.datetimepicker（）；
});
@使用（Html.BeginForm（“IntervalReports”，“温室”，FormMethod.Post））
{

开始日期：@Html.TextBoxFor（m=>m.StartDateCalendar，新的{@id=“txtdatepicker1”，@style=“width:200px；”）


结束日期：@Html.TextBoxFor（m=>m.EndDateCalendar，新的{@id=“txtdatepicker2”，@style=“width:200px；”）

}

脚本文件夹中有所有必要的脚本。

在页面中使用jQuery UI之前，需要包含jQuery库

像这样

<link rel="stylesheet" href="jquery-ui.min.css">
<script src="external/jquery/jquery.js"></script>
<script src="jquery-ui.min.js"></script>

确保您包含了jquery脚本的正确路径，并且必须是html头标记中的第一个，您可以在此处获得最新的jquery脚本

只需在其他js文件的顶部包含以下内容：

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

jQuery UI依赖于jQuery库。

jQueryUI是构建在可用于构建高度交互的jQuery JavaScript库网络应用程序

确保在jQuery UI之前包含对它的引用：

<head>
    <title></title>
    -- jQuery.js reference here --
    <script type="text/javascript" src="~/Scripts/jquery-ui-1.11.4.min.js"></script>
    <script type="text/javascript" src="~/scripts/moment-with-locales.min.js"></script>


--这里有jQuery.js参考--

jquery.js未包含在jquery-ui.js之前，尽管我包含了jquery，但仍然存在相同的问题。js@Maria你能解决这个问题吗？我遇到了同样的问题，结果我两次包含了jQuery。删除第二个引用解决了这个问题。仅供参考，OP包装脚本的当前方式只是您建议的方式的简写。

导致jQuery和普通js之间的名称冲突，因此您必须以不同的方式调用它。对于OP的问题，上述方法比

$.noConflict（）更简洁对，我明白了，这是因为其他库之一也在使用$变量吗？我不是很确定。它可能是另一个库或vanilla js。我做到了，但我仍然有同样的问题我做到了，但我仍然有同样的问题
<head>
    <title></title>
    -- jQuery.js reference here --
    <script type="text/javascript" src="~/Scripts/jquery-ui-1.11.4.min.js"></script>
    <script type="text/javascript" src="~/scripts/moment-with-locales.min.js"></script>