jQuery 날짜 선택기_jquery에 대한 심층 분석

1: 기본적으로 날짜 입력 텍스트 상자가 페이지 포커스를 받으면 날짜 선택기 구성 요소는 날짜 입력 텍스트가 있을 때 오버레이 에서 달력 선택 패널을 엽니다. box 상자가 초점을 잃거나 날짜를 선택하면 달력 선택 패널이 자동으로 닫힙니다.
$(selector).datepicker([options]);
간단한 예:

코드 복사 코드는 다음과 같습니다.

< ;html xmlns="http ://www.w3.org/1999/xhtml">




<스크립트 유형 ="text/javascript" src="JS/jquery.ui.core.js">

< style>
*{font-size:12px; }



날짜를 입력하세요.
< input type="text" id="inputDate" />

렌더링:


2: 팝업 날짜 선택기의 그림 버튼 지정
응답 리소스 파일 추가 필요:

코드 복사 코드는 다음과 같습니다.

$(document).ready(function() {
$("#datepicker" ).datepicker({
showOn: "button",
buttonImage: "Images/calendar.gif",
buttonImageOnly: true
});
});

코드 복사 코드는 다음과 같습니다.

请选择一个日期：

效果图：
  

3：显示带年,月份下拉列表및按钮板적日期选择器

复代代码 代码如下:

< ;meta http-equiv="Content-Type" content="text/html; charset=gb2312" />






<스타일>
*{ 글꼴 크기:12px; }



请输入一个日期：

效果图：
  
4：同时显示多个月份的日期选择器

复主代码 代码如下:

날짜를 선택하세요:

렌더링:


5: 날짜 선택기의 일부 방법
dialog, isDisabled, hide, show, Refresh, getDate, setDate

코드 복사 코드는 다음과 같습니다.

效果图：

  

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.