[jquery] 사용자 입력을 허용하지 않는 텍스트 입력이있는 jQuery Datepicker

텍스트 상자 입력과 함께 jQuery Datepicker를 어떻게 사용합니까?

$("#my_txtbox").datepicker({
  // options
});

사용자가 텍스트 상자에 임의의 텍스트를 입력 할 수 없습니다. 텍스트 상자에 포커스가 있거나 사용자가 클릭 할 때 Datepicker가 팝업되기를 원하지만 텍스트 상자가 키보드 (복사 및 붙여 넣기 또는 기타)를 사용하는 사용자 입력을 무시하고 싶습니다. Datepicker 달력에서 독점적으로 텍스트 상자를 채우고 싶습니다.

이게 가능해?

jQuery 1.2.6
날짜 선택기 1.5.2



답변

텍스트 입력 에서 readonly 속성 을 사용할 수 있어야하며 jQuery는 여전히 내용을 편집 할 수 있습니다.

<input type='text' id='foo' readonly='true'>


답변

내 경험을 바탕으로 Adhip Gupta가 제안한 솔루션을 추천합니다.

$("#my_txtbox").attr( 'readOnly' , 'true' );

다음 코드는 사용자가 새 문자를 입력 없지만 문자를 삭제할 수 있도록합니다.

$("#my_txtbox").keypress(function(event) {event.preventDefault();});

또한 JavaScript를 비활성화 한 사용자에게는 양식이 쓸모 없게됩니다.

<input type="text" readonly="true" />


답변

시험

$("#my_txtbox").keypress(function(event) {event.preventDefault();});


답변

여러 곳에서 날짜 선택기를 재사용하는 경우 다음과 같은 방법으로 JavaScript를 통해 텍스트 상자를 수정하는 것이 좋습니다.

$("#my_txtbox").attr( 'readOnly' , 'true' );

날짜 선택기를 초기화 한 장소 바로 앞 / 뒤


답변

<input type="text" readonly="true" />

포스트 백 후 텍스트 상자의 값이 손실됩니다.

오히려 완벽하게 작동하는 Brad8118의 제안을 사용해야합니다.

$("#my_txtbox").keypress(function(event) {event.preventDefault();});

편집 : IE에서 작동하게하려면 ‘keypress’대신 ‘keydown’을 사용하십시오.


답변

$("#txtfromdate").datepicker({         
    numberOfMonths: 2,
    maxDate: 0,               
    dateFormat: 'dd-M-yy'       
}).attr('readonly', 'readonly');

jquery에 readonly 속성을 추가하십시오.


답변

이 작업을 수행 할 수있는 두 가지 옵션이 있습니다. (내가 아는 한)

  1. 옵션 A : 텍스트 필드를 읽기 전용으로 만드십시오. 다음과 같이 수행 할 수 있습니다.

  2. 옵션 B : 커서 초점을 변경하십시오. 흐림 효과를 설정하십시오. onfocus="this.blur()"날짜 선택기 텍스트 필드에 속성 을 설정하여 수행 할 수 있습니다 .

전의: <input type="text" name="currentDate" id="currentDate" onfocus="this.blur()" readonly/>