DatePicker
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html >
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="./js/core.js"></script>
  <script src="./js/widget.js"></script>
  <script src="./js/datepicker.js"></script>
<script src="./js/jquery.ui.datepicker-ja.js"></script>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="style.css">

<script type="text/javascript">
  $(function() {
  
    $( "#calendar3" ).datepicker({
      beforeShowDay: function(date) {
        var now = new Date("2017/10/09");
        var dateStr = createDateStr(date);
        
        if (date.getTime() > now.getTime()) {
          return [false];
        }
        else if ($( "#dateList" ).val().indexOf(dateStr) != -1) {
          return [true,"ui-datepicker-date-exist"];
        }
        else {
          return [true];
        }
      }
    });
  });
  
  function createDateStr(date) {
    var year = date.getYear();
    var month = date.getMonth() + 1;
    var day = date.getDate();
    if (year < 2000) { year += 1900 };
    if (month < 10)  { month = "0" + month };
    if (day < 10)    { day = "0" + day };
    
    var dateStr = year + "/" + month + "/" + day;
    return dateStr;
  }
  </script>
</head>
<body>
<h3>Taste of Tech Topick 〜DatePickerデモ〜</h3>
<div>
    <p>Date欄をクリックすると、カレンダーが現れます。</p>
<table>
 
  <tr>
    <td>
      Date(未来日は選択不可): 
    </td>
    <td>
    
      <input type="text" id="calendar3" onfocus="datepicker()">
    </td>
  </tr>
</table>

<input type="hidden" id="dateList" value="2011/11/01,2011/11/05,2011/11/12,2011/11/13,2011/11/15,2011/11/18,2011/11/24" />
</div>

</body>

</html>

jqueryのサイト
https://github.com/jquery/jquery-ui/releases