typescript (15) 썸네일형 리스트형 kakao 우편번호 api 사용 kakao 우편번호 API 사용 우편번호 검색창 페이지 html script 태그 작성 주소검색 typescript 작성 $('button[name=btn-address]').click(function() { let daum = window['daum']; new daum.Postcode({ oncomplete: function(data) { // 팝업에서 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분 var address: string = ''; if (data.userSelectedType === 'R') { address = data.roadAddress; } else { address = data.jibunAddress; } (do.. attr() 문법 .attr() 문법 해당 문법은 요소(element)의 속성(attribute)의 값을 가져오거나 속성을 추가한다. input box 자동 포커스 input box 숫자입력시 자동 포커스 .keyup() 사용을 사용하여 html input 태그의 maxlength의 값을 가져와서 비교한다. (검색 키워드는 input 박스 입력시 자동 포커스) $('.w-s').keyup(function(){ var value = ($(this)[0]).value.length; var charLimit = $(this).attr('maxlength'); if (value >= Number(charLimit)) { $(this).next().next('.w-s').focus(); return false; } }); File API File API 정리 File API 찾아보기 FileList - 파일 리스트 File - 파일 데이터 FileReader - 파일 읽기 해당 객체는 비동기적으로 파일의 내용을 읽어들이는데 사용된다. Blob - 바이트 데이터 fileTarget.on('change', function() { if (window.FileReader){ ... } typescript jquery .on() jquery 통합 메서드 on() 이번에 on('change')를 사용해서 값을 변경 해보는 작업을 하였다. 내가 선택한 값의 요소의 정보들이 Object로 표시되어 가지고 와서 해당 input에 val시켜줄 수 있다. window 객체 window 객체 전역객체라고 불린다. JSC, BOM, DOM 모든 객체를 포함하고 있다. (창이나 프레임을 의미한다.) JSC (JavaScript Core) 자바스크립트 언어의 자체에 정의되어 있는 객체들, Object, Arrary, function 등. BOM (Browser Object Model) 웹 페이지의 내용을 제외한 브라우저의 각종 요소들을 객체화 시킨 것이다. 경고창 등. DOM (Document Object Model) 웹 페이지의 문서를 제어하는 객체이다. document 등. window객체는 생략 가능한 객체이다. Property 'split' does not exist on type 'string | number | string[]'. Error Property 'split' does not exist on type 'string | number | string[]'. Error typescript를 사용할때 문자열 자르기 같은경우는 해당 구문 앞에 .toString()을 붙여주자 input type text에 input type file val() 이름 불러오기 아래와 같이 input type이 file 일때 다른 input text에 file 이름 출력할때의 방법이다. 찾아보기 var fileTarget = $('.upload-hidden'); fileTarget.on('change', function() { if (window.FileReader){ // 최신 브라우저 var filename = ($(this)[0]).files[0].name; } else { // 예전 브라우저 var filename = $(this).val().toString().split('/').pop().split('\\').pop(); } $(this).siblings('.upload-name').val(fil.. 이전 1 2 다음