JS 캘린더 플러그인

2077 단어 플러그 인일자
참고: My97DatePicker 이 플러그인은 시간 선택에 있어서 더욱 편리하고 빠른 추천
많은 검색에서 날짜를 사용하고 어떤 검색은 구체적인 시간을 필요로 한다. 많은 달력 플러그인은 날짜만 있고 시간이 없다. 그래서 강력한 인터넷 검색을 통해 기능이 매우 강한 달력 플러그인 JS Calendar를 찾았다.이 플러그인은 다양한 피부, 다국적 언어를 지원하며, 더 중요한 것은 플러그인에 없는 선택 시간의 기능이 많다.
운용 과정에서 몇 가지 작은 문제에 부딪혔다.
    1. 시간 표시 형식은 12시간 형식입니다.
파라미터 선택 시간이 12시간 표시 또는 24시간 표시에 따라 선택 시간 날짜는 12시간 형식으로 표시됩니다. 원본 코드에 대한 분석을 통해 시간 판단이 12시간 이상일 때 시간에 대해 -12 조작을 하는 것을 발견했다. jscal2.js에서'j=i?h-12:h'를 찾으면'j=i?h:h'로 수정하면 됩니다.
    2. 시간 표시 초 없음
JS Calendar 플러그인은 초수를 표시할 매개 변수를 찾지 못했지만 플러그인을 호출할 때 "dateFormat:"% Y-% m-% d% I:% M% p "와 같은 형식을 선택할 수 있습니다. 그러나% p는 AM과 PM을 표시하는 매개 변수이기 때문에"dateFormat: "% Y-% m-% d% I:% M:% M:% M: 00"으로 변경하면 선택한 시간은 출력되지만 초수는 0입니다.
    3. 분을 선택할 때는 5분 단위로.
jscal2.js 원본에서 "minutestep:5"를 찾으면 "minutestep:1"로 변경하면 됩니다.
작은 데모를 써서 사용하기 편하게:
 
<script src="../src/js/jscal2.js"></script>
 <script src="../src/js/lang/cn.js"></script>
<!--cn.js      ,en.js   --><link rel="stylesheet" type="text/css" href="../src/css/jscal2.css">
<label for="f_rangeStart">    :</label> <input id="f_rangeStart" name="starttime"> <script type="text/javascript">
  RANGE_CAL_1 = new Calendar({
          inputField: "f_rangeStart",  //          id       
          dateFormat: "%Y-%m-%d %I:%M %p", //       ,             ,             
          trigger: "f_rangeStart",  //         id,               
          showTime   : 12,           //12         ,   24       true             showTime      ,     
          onSelect: function() {
                  var date = Calendar.intToDate(this.selection.get());
                  LEFT_CAL.args.min = date;
                  LEFT_CAL.redraw();
                  this.hide();
          }
  });
</script>
 

좋은 웹페이지 즐겨찾기