bootstrap datepicker 时间插件 只显示 特定日期

bootstrap datepicker 时间插件只显示特定日期（该日期从后台返回） 

html代码

<title>jQuery UI 日期选择器（Datepicker） - 默认功能</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.9.1.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">

<p>日期：<input type="text" id="datepicker"></p>

js代码

<script>
  var availableDates = ["9-3-2017","20-3-2017","20-4-2017","2-4-2017","14-3-2017","15-3-2017"];

function available(date) {
  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
  if ($.inArray(dmy, availableDates) != -1) {
    return [true, "","Available"];
  } else {
    return [false,"","unAvailable"];
  }
}
  $(function() {
    $( "#datepicker" ).datepicker({
                 format: "dd/mm/yyyy",
                startDate: "today",
                autoclose: true,
                beforeShowDay:available
    });
  });
  </script>

 

注释：引入的js是网络的，速度估计略微慢，可以改成本地的

可见可选的日期是此处的数组---如需要可以后台返回json再转换

转载于:https://my.oschina.net/u/3255899/blog/849146