자바 스크립트 배열과 출력

Question

Codepen Link

JSFiddle Link

에 입력의 속성을 분할 목적 :

입력 필드에서 분할 년 - 월 - 일에 동적으로 상쾌한 출력을 생성합니다.

설명 :

라인 (40)의 코멘트 위 CodePen의 코드에 관심을 지불하지 마십시오

입력 사항이 있습니다. 사용자가 datepicker가 초기화 된 날짜를 선택할 때마다 입력은 data-date 속성이 YYYY-mm-dd 형식으로 표시됩니다. 좋습니다.

이 data-date 속성을 기반으로 div에 대한 출력을 만들고 싶습니다.

function summaryOutput() { 
    var output  = $('#output'); 
    var end   = $('#end'); 

    end.on('change', function() { 
     var endString = end.attr('data-date'); 
     var endSplit  = endString.split('-'); 
     var year   = endSplit[0]; 
     var month  = endSplit[1]; 
     var day   = endSplit[2]; 

     output.text(year); 
    }); 

} 

그것은 매우 간단합니다 :

그래서 나는 다음과 같은 코드를 썼습니다.

Uncaught TypeError: Cannot read property 'split' of undefined

그리고 무엇보다, data-date 적용 중단 속성 :

이 기능은 오류를 호출하고 날짜를 선택하려고 참조 codepen

에 호출되지 않습니다 .

더 혼란스러운 것은 콘솔에서 작동합니다. 내 말은, datepicker에서 날짜를 선택한 다음 단계별로 모든 변수를 초기화 한 다음 예를 들어 변수가 month 인 것을 확인하면 결과가 표시됩니다.

그러나 실제 문서에서는 작동하지 않습니다.

나는 어디에서 잘못 되었습니까?

Answer 1

입력 태그에 데이터 - 날짜 속성을 추가해야합니다.

변경 입력 태그는 다음과 같이합니다 :

<input type="text" id="end" data-date="">