jQuery.Deferred 异常：$(...).datepicker 不是函数
Posted
技术标签:
【中文标题】jQuery.Deferred 异常：$(...).datepicker 不是函数【英文标题】：jQuery.Deferred exception: $(...).datepicker is not a function 【发布时间】：2017-06-16 12:45:45 【问题描述】：提前致谢。
我已经搜索并实现了
$(document).ready(function ()
$("#ui-datepicker").datepicker();
);
和
$(function ()
if (!Modernizr.inputtypes.date)
$('input[type=date]').datepicker(
dateFormat: 'dd-mm-yyyy'
);
);
但无法解决问题。所以，请看我下面的代码并告诉我有什么问题
<html class=" js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cs-s-reflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths" style="">
<head>
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<link href="/Content/bootstrap.min.css" rel="stylesheet">
<link href="/Content/font-awesome.min.css" rel="stylesheet">
<link href="/Content/animate.css" rel="stylesheet">
<link href="/Content/style.css" rel="stylesheet">
<script src="/Scripts/modernizr-2.8.3.js"></script>
<!-- Tweaks for older IEs-->
<!--[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>
<div class="section-modal modal fade in" id="new-product-modal" tabindex="-1" role="dialog" aria-hidden="true" style="display: block;overflow-y:scroll;">
<div class="modal-content">
<div class="close-modal" data-dismiss="modal">
<a href="/">
<div class="lr">
<div class="rl">
</div>
</div>
</a>
</div>
<div class="container">
<div class="row">
<div class="section-title text-center">
<h3>Products</h3>
<p>Add a new product into List</p>
</div>
</div>
<form returnurl="" action="/Home/Products" enctype="multipart/form-data" method="post">
<input name="__RequestVerificationToken" value="Cni4uRd3UIZMvQsCWzpt3GQRxRmybm2yKX2xsOHkvS2D_f4qezvaBU38Mg6HYOJZwwe7bIYpjvWSgYOzdA2LxN3MBxG8uGvvB4-xN4W1LK41" type="hidden"> <div class="row form-group warning-message-container">
<div class=" danger" style="color:red;background-color:lightpink;border-radius:0.3em;text-align:center;"></div>
</div>
<div class="row">
<div class="col-md-3">
<div class="form-group text-right">
<label class="form-label" for="ProductName">Product Name</label> <span style="color:red;">*</span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input class="form-control" data-val="true" data-val-required="The ProductName field is required." id="name" name="ProductName" placeholder="Your Product Name *" value="" type="text">
<span class="field-validation-valid" data-valmsg-for="ProductName" data-valmsg-replace="true"></span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-3">
<div class="form-group text-right">
<label class="form-label" for="Stock">Stock</label> <span style="color:red;">*</span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<div class="col-sm-6">
<div class="row form-group">
<input class="form-control" data-val="true" data-val-number="The field Stock must be a number." data-val-required="The Stock field is required." id="name" name="Stock" placeholder="Your Stock *" value="0" type="text">
<span class="field-validation-valid" data-valmsg-for="Stock" data-valmsg-replace="true"></span>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<select class="form-control" data-val="true" data-val-number="The field Stock Unit must be a number." data-val-required="The Stock Unit field is required." id="StockUnit" name="SelectedStockUnit" placeholder="Select Unit *">
<option selected="selected" value="0">Select a Unit</option>
<option value="1">Kilogram</option>
<option value="2">Grams</option>
<option value="3">Ton</option>
<option value="4">Liter</option>
<option value="5">Dozen</option>
<option value="6">Quintel</option>
<option value="7">Milli Gram</option>
<option value="8">Peices</option>
</select>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-3">
<div class="form-group text-right">
<label class="form-label" for="StockDate">Stock available on Date</label> <span style="color:red;">*</span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input class="text-box single-line" data-val="true" data-val-date="The field Stock on Date must be a date." data-val-required="The Stock on Date field is required." id="StockDate" name="StockDate" value="01/01/0001" type="date">
<span class="field-validation-valid" data-valmsg-for="StockDate" data-valmsg-replace="true"></span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-3">
<div class="form-group text-right">
<label class="form-label" for="ProductDesc">Product Description</label>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<textarea class="form-control" cols="20" id="ProductDesc" name="ProductDesc" placeholder="Product Description" rows="2" type="text"></textarea>
<span class="field-validation-valid" data-valmsg-for="ProductDesc" data-valmsg-replace="true"></span>
</div>
</div>
</div>
<div class="row">
<div class="clearfix"></div>
<div class="col-lg-12 text-center">
<div id="success"></div>
<button type="submit" class="btn btn-primary" value="Save">Save</button>
</div>
</div>
</form>
</div>
</div>
</div>
<script src="/Scripts/jquery-ui-1.12.1.js"></script>
<script src="/Scripts/jquery-3.1.1.js"></script>
<script src="/Scripts/jquery.appear.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/Custom/DatePickerReady.js"></script>
<script src="/Scripts/respond.matchmedia.addListener.js"></script>
<script src="/Scripts/respond.js"></script>
<script src="/Scripts/Custom/dropdownlist.js"></script>
<script src="/Scripts/script.js"></script>
</body>
</html>
日期时间选择器不适用于 Mozilla Firefox。
【问题讨论】：
脚本顺序，先jquery再jquery-ui，<script src="/Scripts/jquery-3.1.1.js"></script> <script src="/Scripts/jquery-ui-1.12.1.js"></script>
除了@ArunPJohny <script src="/Scripts/modernizr-2.8.3.js"></script> 把它放在jquery js 之后而不是head 标签
嗨，阿伦，我已经更改了订单。现在出现日历，但我无法在日历控件中更改年份，而且 ui 也不正确。您对此有任何建议。
还要确保你的页面上没有包含 Jquery TWICE！
【参考方案1】：
$(...).datepicker 不是函数
你的脚本顺序错误，
jquery 库文件应该总是在最上面，然后是 jquery-ui。 保持
modernizr-2.8.3.js
之后
jquery-3.1.1.js 和 jquery-ui-1.12.1.js
【讨论】：
嗨 minksnmn，我已经更改了订单。现在出现日历，但我无法在日历控件中更改年份，而且 ui 也不正确。您对此有任何建议。 你需要为它添加 CSS，从你有这个插件 jquery 中找到 CSS，或者你的 css 与插件的 CSS 冲突。 嗨 Minksmnm，即使按顺序添加了 jQuey 和 jQuery ui，我在 DatePicker 的按钮单击事件上也遇到了同样的错误。这是代码： 错误：jQuery.Deferred 异常：$(...).datePicker 不是函数...以上是关于jQuery.Deferred 异常：$(...).datepicker 不是函数的主要内容，如果未能解决你的问题，请参考以下文章
jQuery.Deferred 异常：无法读取未定义的属性（读取“长度”）-> Laravel 8 Boilerplate + Bootstrap
拥抱基于jquery.deferred的ajax,和层层嵌套回调的ajax说拜拜
jQuery异步框架探究2:jQuery.Deferred方法