我有這個錯誤：$（...）。datepicker不是函數

我嘗試使用日期選擇器，但它不起作用。

我有這樣的錯誤：$(...).datepicker不是一個函數

我用很多框架和librairy（Adminlte，引導，chartjs，數據表）。我認爲他們之間有衝突。

$(document).ready(function() { 
 
    $('#datepicker').datepicker(); 
 
    $('#datepicker').on("changeDate", function() { 
 
     $('#my_hidden_input').val(
 
      $('#datepicker').datepicker('getFormattedDate') 
 
     ); 
 
    }); 
 
});

<!DOCTYPE html> 
 
<html lang="fr"> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <title>AdminLTE 2 | Dashboard</title> 
 
    <!-- Tell the browser to be responsive to screen width --> 
 
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> 
 
    <!-- Bootstrap 3.3.6 --> 
 
    <link rel="stylesheet" href="./css/bootstrap.min.css"> 
 
    <!-- Font Awesome --> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css"> 
 
    <!-- Ionicons --> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css"> 
 

 
    <!-- Theme style --> 
 
    <link rel="stylesheet" href="./css/AdminLTE.min.css"> 
 
    <!-- AdminLTE Skins. Choose a skin from the css/skins 
 
     folder instead of downloading all of them to reduce the load. --> 
 
    <link rel="stylesheet" href="./css/skin-black-light.css"> 
 
    <!-- CSS Table --> 
 
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css"> 
 

 

 
    <!-- My Style --> 
 
    <link rel="stylesheet" href="./css/style_general.css"> 
 
    <link rel="stylesheet" href="./css/style.css"> 
 

 
    <link rel="stylesheet/less" type="text/css" href="./less/dropdown.less" /> 
 
    <link rel="stylesheet/less" type="text/css" href="./less/sprites.less" /> 
 

 

 
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> 
 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
 
    <!--[if lt IE 9]> 
 
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> 
 
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
 
    <![endif]--> 
 
</head> 
 

 
<body class="hold-transition skin-blue sidebar-mini fixed"> 
 
    
 
           <div class="form-group"> 
 
           <label>Date</label> 
 
           <div class="input-group date margin-bottom-10" id="datetimepicker1"> 
 
            <input type="text" class="form-control" id="date" name="date" placeholder="DD/MM/YYY"> 
 
            <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span> 
 
           </div> 
 
          </div> 
 
    
 
    <!-- jQuery 2.2.3 --> 
 
    <script src="https://code.jquery.com/jquery-2.2.3.min.js"></script> 
 
    <!-- Bootstrap 3.3.6 --> 
 
    <script src="./js/bootstrap.min.js"></script> 
 
    <!-- AdminLTE App --> 
 
    <script src="./js/app.min.js"></script> 
 
    <!-- ChartJS 1.0.1 --> 
 
    <script src="./js/Chart.min.js"></script> 
 
    <!-- AdminLTE for demo purposes --> 
 
    <script src="./js/demo.js"></script> 
 
    <!-- SlimScroll 1.3.0 --> 
 
    <script src="./js/jquery.slimscroll.min.js"></script> 
 
    <!-- JS table --> 
 
    <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> 
 
    <script src="./js/test_table.js"></script> 
 
    <script src="./js/js.js"></script> 
 
</body> 
 

 
</html>

來源

2016-09-26 DenisMasot

你包括'jquery'嗎？ –

嘗試jQuery（...）。datepicker –

不要鏈接到jsbin，但不包括問題中的一些實際代碼... – evolutionxbox

我覺得日期選擇器是JQuery用戶界面可用，但你並沒有包括那些庫文件。當我包括下面的文件有沒有這樣的錯誤$（...）。日期選擇器

請包含這些文件，並檢查
[鏈接] https://code.jquery.com/ui/1.12.1/jquery-ui.js
[鏈接] https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css

來源

2016-09-26 10:57:42

我添加鏈接，但它不會改變任何東西 – DenisMasot

請檢查此鏈接[鏈接] https：// jqueryui。 com/datepicker/ – 2016-09-26 11:59:49

@Naveen我以爲我在過去的一個小時里正在追逐鬼魂，因爲我在這裏得到了和OP一樣的錯誤。我一直都在使用Google進行測試，直到我終於遇到了這個問題（您的回答更具體是我的解決方案），而我必須使用更新版本的jquery ui。所有其他（類似）問題/答案都沒有幫助我，但是你的確做到了;只是認爲我會與你分享，*歡呼* –

請確保您包括您使用它的頁面上datapicker.js庫。確保鏈接/本地文件存在。如果您使用bootstrap/framework，它可能是從另一個文件加載的。

這是最常見的原因。

來源

2016-09-26 10:24:31 Marcin

錯誤的訂單是一個常見問題，所以不止一次地包含jQuery.js。錯誤可以拋出的衆多原因 – charlietfl

我添加鏈接，但它不會改變任何東西 – DenisMasot

-1

Inclue JqueryUI

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

來源

2016-09-26 10:25:34

我已經經歷了所有的js文件了。

注意到您正在使用AdminLTe爲您的js和css。在這種情況下，請再次檢查左側面板中的Forms > Advanced Elements中的示例。

我想你錯過了bootstrap datepicker：嘗試搜索這個js文件中AdminLTe例：<link rel="stylesheet" href="../../plugins/datepicker/datepicker3.css">

來源

2016-09-26 10:31:47 Jacky

我不使用引導日期選擇器 – DenisMasot

<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 

<script> 
    var j = jQuery.noConflict(); 
    j(function() { 
     j("#datepicker").datepicker(); 
    }); 
</script>

請嘗試這種方式。它工作正常。同樣的對象是由jQuery定義和使用，所以它的衝突嘗試以上欺騙其工作正常..

來源

2017-03-20 06:45:17 Sarjil

請正確選擇你的代碼，並添加一些解釋與你的代碼清晰。 – mickmackusa

謝謝:)我會的 – Sarjil

我有這個錯誤：$（...）。datepicker不是函數

回答

相關問題