jQuery datepicker 函数：datepicker 不是函数
Posted
技术标签:
【中文标题】jQuery datepicker 函数：datepicker 不是函数【英文标题】：jQuery datepicker function: datepicker not a function 【发布时间】：2017-10-13 21:35:43 【问题描述】：我正在尝试在此处添加 jQuery datepicker 函数。但是我收到一个错误，例如“日期选择器不是函数”。请让我知道出了什么问题。我解决了其他问题并尝试纠正但没有奏效。
<script>
$(function ()
var $j = jQuery.noConflict();
$j("#From").datepicker();
);
//$(function ()
// $('#datetimepicker2').datetimepicker(
// );
//);
</script><!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Reports</title>
<link href="~/Content/Site.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.12.4.js"></script>
<script src="~/Scripts/jquery-ui-1.12.1.js"></script>
</head>
<body>
<div class="container">
<!-- Form Starts-->
<form name="PTTReport" style="padding-top:20px">
<div class="panel panel-primary">
<div style="padding-bottom:25px" class="panel-heading fixed_panel">
<span>Report Filters</span>
</div>
<div class="panel-body">
<div class="row pb-20px">
<label id="From1" class="col-sm-1">From</label>
<input type="text" class="col-sm-2" id="From" />
<label id="To" class="col-sm-1">To</label>
<input type="text" class="col-sm-2" id="To" />
</div>
<div class="row">
<div class='col-sm-5'>
<div class="form-group">
<label id="From1" class="col-sm-2">From</label>
<div class='input-group date' id='datetimepicker2'>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</form>
</div>
</body>
</html>整个cshtml页面，
<!DOCTYPE html>
<script>
$(function ()
var $j = jQuery.noConflict();
$j("#From").datepicker();
);
//$(function ()
// $('#datetimepicker2').datetimepicker(
// );
//);
</script>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Reports</title>
<link href="~/Content/Site.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.12.4.js"></script>
<script src="~/Scripts/jquery-ui-1.12.1.js"></script>
</head>
<body>
<div class="container">
<!-- Form Starts-->
<form name="PTTReport" style="padding-top:20px">
<div class="panel panel-primary">
<div style="padding-bottom:25px" class="panel-heading
fixed_panel">
<span>Report Filters</span>
</div>
<div class="panel-body">
<div class="row pb-20px">
<label id="From1" class="col-sm-1">From</label>
<input type="text" class="col-sm-2" id="From" />
<label id="To" class="col-sm-1">To</label>
<input type="text" class="col-sm-2" id="To" />
</div>
<div class="row">
<div class='col-sm-5'>
<div class="form-group">
<label id="From1" class="col-sm-2">From</label>
<div class='input-group date' id='datetimepicker2'>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</form>
</div>
</body>
</html>
【问题讨论】：
你的 JS 代码在 HTML 中的什么位置？ 就在 标签关闭之后 应该是之前</head>，而不是之后
现在我收到“未捕获的 ReferenceError: $ is not defined”
这意味着在包含 JS 时没有定义 jQuery。请编辑您的问题以显示您正在使用的 HTML
【参考方案1】：
您是否在 DOM 中包含 datepicker JS 文件？你能更新最新的代码吗？
【讨论】：
我已经在 关闭之后在 HTML 页面本身中添加了 JS【参考方案2】：检查下面的sn-p。它的工作
$(function ()
var $j = jQuery.noConflict();
$j(".datepicker").datepicker();
);
//$(function ()
// $('#datetimepicker2').datetimepicker(
// );
//);<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Reports</title>
<link href="~/Content/Site.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet"/>
</head>
<body>
<div class="container">
<!-- Form Starts-->
<form name="PTTReport" style="padding-top:20px">
<div class="panel panel-primary">
<div style="padding-bottom:25px" class="panel-heading fixed_panel">
<span>Report Filters</span>
</div>
<div class="panel-body">
<div class="row pb-20px">
<label id="From1" class="col-sm-1">From</label>
<input type="text" class=" datepicker col-sm-2" id="From" />
<label id="To" class="col-sm-1">To</label>
<input type="text" class="datepicker col-sm-2" id="To" />
</div>
<div class="row">
<div class='col-sm-5'>
<div class="form-group">
<label id="From1" class="col-sm-2">From</label>
<div class='input-group date' id='datetimepicker2'>
<input type='text' class="form-control datepicker" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</form>
</div>
</body>
</html>【讨论】：
那么问题可能出在我的代码中。它根本不起作用。很奇怪 我认为你错过了外部“jqueryui css”、“jqueryui.js”的路径，可能是“javacriptlibrary” 它适用于普通的html页面，但不适用于MVC cshtml页面【参考方案3】：试试这个：
$(function()
var j = jQuery.noConflict();
j("#From").datepicker();
);
【讨论】：
以上是关于jQuery datepicker 函数：datepicker 不是函数的主要内容，如果未能解决你的问题，请参考以下文章
在 beforeShowDay 函数中更改 datepicker 日期格式
PHP 将PHP date（）样式dateFormat转换为等效的jQuery UI datepicker字符串