2014-05-23 57 views
0

我一直在試圖讓Datepicker for Bootstrap工作,但一直不成功。該datapicker箱從未顯示:不能讓引導日期選擇器工作

<head> 
    <title>Pick-a-Date</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <link rel="stylesheet" href="css/bootstrap.min.css"> 
    <link rel="stylesheet" href="css/bootstrap-theme.min.css"> 
    <link rel="stylesheet" href="css/datepicker.css"> 
    <script src="js/jquery-2.1.1.min.js" type="text/javascript"></script> 
    <script src="js/bootstrap.min.js" type="text/javascript"></script> 
    <script src="js/bootstrap-datepicker.js" type="text/javascript"></script> 
</head> 
<body> 
<div class="container"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h3 class="panel-title">Select date</h3> 
     </div> 
     <div class="panel-body"> 
      <div class="input-append date" id="datepick" data-date="<?=date('m-d-Y', strtotime('-25 hours')) ?>" data-date-format="dd-mm-yyyy"> 
       <input class="span2" size="16" type="text" value="<?=date('m-d-Y', strtotime('-25 hours')) ?>"> 
       <span class="add-on"><i class="icon-calendar"></i></span> 
      </div> 
     </div> 
    </div> 
</div> 
<script type="text/javascript"> 
    $(function() { 
     $('#datepick').datepicker({ 
      format: "yyyy/mm/dd", 
      autoclose: true, 
      todayHighlight: true 
     }); 
    }); 
</script> 
</body> 

這裏是小提琴: http://jsfiddle.net/eComEvo/7svU3/2/

任何想法有什麼不好?

+0

引導-datepicker.js沒有被加載在你的小提琴 - 404個 – dmullings

+1

@dmullings是正確的,你鏈接到一個不存在的文件。順便說一句,在開發JS應用程序時,要習慣於打開JS控制檯。 – Babblo

+0

該網站阻止了直接鏈接。我將完整的代碼從'http:// www.eyecon.ro/bootstrap-datepicker/js/bootstrap-datepicker.js'添加到JS框架中。仍然不起作用。我把它在我的測試服務器上本地下載,所以它不會成爲它失敗的原因。 – eComEvo

回答

0

如果您將對引導日期選擇器的引用更改爲可解析的內容,例如//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js,它的工作原理。

http://jsfiddle.net/eComEvo/7svU3/2/

<div class="container"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h3 class="panel-title">Select date</h3> 
     </div> 
     <div class="panel-body"> 
      <div class="input-append date" id="datepick" data-date="22-05-2014" data-date-format="dd-mm-yyyy"> 
       <input class="span2" size="16" type="text" value="22-05-2014"> 
       <span class="add-on"><i class="icon-calendar"></i></span> 
      </div> 
     </div> 
    </div> 
</div> 

$(function() { 
    $('#datepick').datepicker({ 
     format: "yyyy/mm/dd", 
     autoclose: true, 
     todayHighlight: true 
    }); 
}); 
+0

它會出現我有一個從他們的網站的代碼引用的功能失調的副本。使用CDN中的一個修復問題。謝謝! – eComEvo

+0

沒問題。樂意效勞。 – Leirith

相關問題