无法解决未捕获的类型错误：$(...).datepicker 不是函数

Posted 2023-05-07

【中文标题】无法解决未捕获的类型错误：$(...).datepicker 不是函数

【英文标题】：Unable to resolve Uncaught TypeError: $(...).datepicker is not a function

【发布时间】：2017-03-26 04:42:13

【问题描述】：

我知道这已经有很多话题了。我已经阅读了其中的许多内容并尝试了其中的解决方案，但均无济于事。

这就是我的想法：

<script src="/Areas/IRF/Scripts/jquery-2.1.3.js"></script>
<script src="/Areas/IRF/Scripts/jquery.inputmask/jquery.inputmask.js"></script>
<script src="/Areas/IRF/Scripts/jquery.validate.js"></script>
<script src="/Areas/IRF/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="/Areas/IRF/Scripts/moment.js"></script>
<script src="/Areas/IRF/Scripts/bootstrap-datetimepicker.js"></script>
<script src="/Areas/IRF/Plugins/PNotify/pnotify.custom.min.js"></script>
<script src="/Areas/IRF/Scripts/CustomModules/app-notifications.js"></script>

还有一些 CSS 文件：

<link href="/Areas/IRF/Content/bootstrap.css" rel="stylesheet" />
<link href="/Areas/IRF/Content/bootstrap-datetimepicker.css" rel="stylesheet" />
<link href="/Areas/IRF/Content/typeahead.css" rel="stylesheet" />
<link href="/Areas/IRF/Content/site.css" rel="stylesheet" />
<link href="/Areas/IRF/Plugins/PNotify/pnotify.custom.min.css" rel="stylesheet" />
<link href="/Areas/IRF/Content/irf-theme.css" rel="stylesheet" />
<link href="/Areas/IRF/Plugins/Qtip/jquery.qtip.min.css" rel="stylesheet" />

那么……

<script type="text/javascript">
    $(document).ready(function () 
        ... some stuff
    );

    $(function () 
        $('.RequestedResponseDate').datepicker(
            format: 'mm/dd/yyyy',
            startDate: '-3d'
        );
    );
</script>

最后……

<div class="input-group date" data-provide="datepicker">
    <input class="form-control datepicker valid" data-val="true" data-val-date="The field Requested Response Date must be a date." id="RequestedResponseDate" name="RequestedResponseDate" placeholder="MM/DD/YYYY" type="text" value="" aria-describedby="RequestedResponseDate-error">
    <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
    </span>
</div>

我收到此错误：

New:514 Uncaught TypeError: $(...).datepicker is not a function
    (anonymous function) @ New:514fire @ jquery-2.1.3.js:3094
    self.fireWith @ jquery-2.1.3.js:3206
    jQuery.extend.ready @ jquery-2.1.3.js:3412
    completed @ jquery-2.1.3.js:3428

我尝试重新排序 jquery-2.1.3.js 的引用所在的位置（将其向下移动），但这只会导致其他问题。我也试过添加 $.noConflict();

    $.noConflict();
    $(function () 
        $('.RequestedResponseDate').datepicker(
            format: 'mm/dd/yyyy',
            startDate: '-3d'
        );

但是同样的错误出现了两次！

Uncaught TypeError: $ is not a function
(anonymous function) @ New:514

【问题讨论】：

检查文件是否被包含

bootstrap-datetimepicker.js 来自哪里

凯文，不明白你的意思

giannis，是的，该文件已包含在内。如果没有，控制台窗口中会出现 404 错误

@CaseyCrookston 链接到该文件的 github url。它是什么？你在哪里得到它？日期选择器在哪里定义？

【参考方案1】：

问题最终是缺少对 jquery-ui.js 的引用

【参考方案2】：

您需要添加bootstrap-datepicker.js 而不是bootstrap-datetimepicker.js。

它们是不同的插件