IE에서 날짜 피커를 지원하는 IE를 얻는 방법

Question

jquery 모바일을 사용하여 IE에서 날짜에 대한 입력 태그를 만들 때 크롬처럼 표시되는 캘린더 팝업이 없습니다. IE 용 캘린더 팝업을 만들 수있는 플러그인을 다운로드 할 수 있습니까? 여기

내 내가 사용 HTML입니다 :

<input id="EndDate" name="EndDate" type="date" value=""> 

그리고 내장 된 날짜 선택기는 IE 8, 9, 10 등 (내가 테스트 한 IE의 모든 버전에서 사용할 수없는)

Answer 1

<input type="date">은 모든 버전의 IE에서 기본 기능으로 지원되지 않습니다.

최상의 해결책은 "Polyfill"스크립트를 사용하는 것입니다. Polyfills는 특정 브라우저에서 누락 된 기능에 대한 지원을 추가하기 위해 작성된 작은 스크립트입니다. 일반적으로 사이트 작성자는 일반 표준 HTML 또는 CSS 코드를 작성할 수 있으며 polyfill 스크립트는 기능을 작동시키기 위해 배후에서 작업을 수행합니다.

Modernizr 프로젝트는 a Wiki page that lists a whole stack of polyfill scripts입니다. 이 페이지에는 <input type='date'> 기능을 polyfill하는 스크립트가 두 개 이상 포함되어 있습니다. 먼저이 스크립트를 사용해 보는 것이 좋습니다. (웹에 다른 사람이있을 수도 있지만, Modernizr이 추천하는 경우 아마도 가장 좋은 사람 일 것입니다.)

Modernizr으로 말하면이 스크립트를 사용하는 것이 좋습니다. 브라우저가 지원하는 기능과 polyfill 스크립트를로드해야하는지 여부를 결정합니다.

Modernizr 사이트에는 브라우저 기능 감지 및 Modernizr을 사용하여 polyfill 스크립트를로드하는 방법에 대한 지침이 있으므로 여기에서 반복하지 않겠습니다.

또는 Modernizr을 사용하고 싶지 않으면 자신 만의 고유 한 기능인 스크립트를 작성할 수 있습니다. 매우 쉽습니다. 이런 식으로 뭔가 트릭 수행해야합니다

function browserSupportsDateInput() { 
    var i = document.createElement("input"); 
    i.setAttribute("type", "date"); 
    return i.type !== "text"; 
} 

을 다음이처럼 사용하십시오 : 도움이

if(!browserSupportsDateInput()) { 
    //not supported, so run the polyfill script instead. 
} 

희망을.

Answer 2

언제든지 제 3 자 날짜 선택기를 jQuery Mobile 용으로 사용할 수 있습니다.

이들 중 3 개만 언급되며 특정 날짜 형식을 표시하도록 모든 사용자를 구성 할 수 있으며 모든 장치가 모든 장치에서 작동합니다. 네가 모바일/데스크톱 데이트 피커와 같은 스킨을 가지고 있기 때문에 Mobiscroll을 추천 해 주시겠습니까?

Mobiscroll - http://jsfiddle.net/Gajotres/WDjfR/

$(document).on('pagebeforeshow', '#index', function(){  
    $('#demo').mobiscroll().date({ 
     invalid: { daysOfWeek: [0, 6], daysOfMonth: ['5/1', '12/24', '12/25'] }, 
     theme: 'android-ics', 
     display: 'inline', 
     mode: 'scroller', 
     dateOrder: 'dd mm yy', 
     dateFormat : "dd-mm-yy" 
    }); 
}); 

Mobipick-http://jsfiddle.net/Gajotres/zyVjE/

$(document).on('pagebeforeshow', '#index', function(){  
    $('#demo').mobipick({ 
     dateFormat: "MM-dd-yyyy" 
    }); 
}); 

Datebox-http://jsfiddle.net/Gajotres/ktbcP/

<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox", "useNewStyle":true, "dateFormat": "mm/dd/YYYY"}'/> 

Answer 3

기본적으로 최신 HTML5 date 입력을 사용하면 모바일에서 동일한 최신 경험을 제공하며 이는 모든 datepicker보다 우수하며 모든 기기에서 일관성을 유지할 수 있다는 이점이 있습니다. 오늘로

<input type="date"> 

은 크롬 바탕 화면에 대한 지원을하고, 다른 브라우저 결국 따라서 우리는이 첫 번째를 사용하여 개발하고 우리는 여전히있는 동안 가장자리 케이스를 잡기 위해 JS를 사용한다 잡을 것이라고 가정하는 공정이다 에.

나는이 가장자리 사례를 처리하기 위해 모더 나이저를 사용하십시오 :

if !Modernizr.inputtypes.date 
    // initialise your own datepicker 
    // eg. http://amsul.ca/pickadate.js - which has the best support I've seen (IE8+) 

이 방법은, 다른 모든 것들은 JS의 날짜 선택기를 시작합니다 것 date 입력을 지원하는 모든 브라우저를. '결국'JS를 정말로 쉽게 미래의 요소로 추가 보너스로.