본문 바로가기

반응형
JAVASCRIPT & JQUERY
반응형
60

시간을 지연 시켜주는 함수 setTimeout 시간을 지연 시켜주는 함수 setTimeout 안녕하세요 오늘은 자바스크립트 중에서 시간을 지연 시켜주는 함수 setTimeout에 대해 이야기해보겠습니다. setTimeout이란 특정 코드를 사용자의 의도에 따라 시간을 지연시켜주는 함수라고 말할 수 있습니다. 저 같은 경우에는 페이지 오픈 시에 프린터 화면을 조금 지연 시키는데 사용했습니다. 예제를 보시면서 설명을 하겠습니다. 1 2 3 4 5 6 7 8 9 Colored by Color Scripter cs 우선 저는 프린트 출력을 하는 목적이기 때문에 printAction이란 함수를 만들었습니다. 그리고 setTimeout 함수를 선언한 후 호출할 값을 적어준 다음, 뒷부분은 지연시간을 작성합니다. 코드를 예를 들어 보면 Window.print().. 2020. 6. 17.
제어쿼리 Form Action 값 변경 안녕하세요. 제이쿼리 Form Action 값 변경에 대해 이야기해보려 합니다. (2021년 3월 13일자로 내용 수정하였습니다.) 흔히 아래와 같이 Form에서 action값을 이용하여 컨트롤러로 보냅니다. 제가 겪었던 상황은 일반 사용자일 경우, 시설의 사용 허가 조건 서약을 작성하는 것이였고, 관리자일 경우는 이 경우를 뛰어넘어 바로 예약으로 넘어가는 상황을 만들어야 했습니다. 허나, 폼 값의 action값이 하나이기 때문에 제이쿼리에서 변경하여 구현한 사례입니다! 제이쿼리를 통해서 아래와 같이 작성해 보았습니다. 1 2 3 예약하기 /div> Colored by Color Scripter cs 우선, 예약하기 버튼에 onclick으로 설정되어 있는 fnResve();를 제이쿼리에서 아래와 같이 선.. 2020. 6. 12.
[HTML] HTML 개념 정리 오늘은 HTML에 대한 개념 정리 글을 작성해보려합니다. 보통 프론트엔드 개발자라면 HTML를 언어로 생각하지 않거나 등한시하는 경우가 대부분인데요. 은근히 에러가 발생되는 부분 또한 HTML 부분일 가능성도 있고, HTML를 중요시하는 개발자가 점점 늘어나는 추세입니다. 개발자라 할지라도 HTML를 꾸준히 배워할 필요성이 있는 것 같습니다... (저도 많이 혼나는 중이라 겸사겸사해서 정리해보았습니다 ㅜㅜ) 혹시 틀린 부분이나 고칠 부분에 대해 댓글 부탁 드립니다~ HTML (HyperText Markup Language) : 웹에서 자유롭게 오갈 수 있는 웹 문서를 만드는 언어 Markup : Tag를 사용해 문서에서 어느 부분이 제목이고 본문인지 어느 부분이 사진이고 링크인지 표시 HyperText .. 2020. 4. 13.
[HTML&JQUERY & SPRING] 버튼 클릭 시, 숫자 증감/감소 기능 안녕하세요. 버튼을 클릭할 경우에 숫자가 증가하고 감소하는 기능을 구현하려 합니다. (코드를 재수정하였습니다.2020년 12월) 화면 부분부터 보면.. HTML 부분입니다. 1 2 3 4 5 6 7 8 9 수량 7 + - Colored by Color Scripter cs button onclick 속성에 값을 넣어주고 this 를 넣어 자기 자신 값을 부여합니다. 또한 p와 m을 넣어줘서 type을 구분할 수 있도록 합니다. input 에서는 디비와 연동할 수 있도록 name 값을 넣어줍니다. 다음은 SCRIPT 부분입니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 function fnCalCount(type, ths){ var $input = $(ths).parents("td").find.. 2020. 2. 28.
[HTML & JQUERY] 버튼 클릭 후 팝업창 기능 구현 HTML 버튼을 클릭하여 팝업창을 불러오는 경우를 구현하고자 합니다. 우선 HTML을 이용하여 아래와 같은 버튼을 만들어줍니다. HTML을 작성하였으면 SCRIPT 부분으로 넘어와 JQEURY를 작성합니다. onclick을 이용하여 함수 이름을 정이해주고, url 설정과 popup의 옵션 값을 설정합니다. 2020. 2. 26.
[HTML&JQUERY] 리스트 삭제 버튼 구현 안녕하세요. 버튼을 통해서 행을 지우는 방법에 대해 알아보겠습니다. 보통의 HTML 리스트 형태는 아래와 같습니다. (코드를 재수정하였습니다 2020년 12월) 리스트 항목을 삭제하기 위해서는 마지막 항목에 삭제 버튼을 넣어준 뒤, 제이쿼리를 이용해 선택 행을 지우는 작업이 필요합니다. HTML tbody 안에 button 태그를 입력한 후에 함수에서 받을 수 있도록 onclick 속성에 값을 입력한다. 이때 자신을 선택하도록 (this)를 넣어줍니다. 1 2 3 4 5 6 7 8 9 10 11 수량 + - X Colored by Color Scripter cs SCRIPT 스크립트 부분에서 onclick 값을 선언한 후에 행을 지우기 위해 부모값 ("tr")을 선언한 후, remove를 작성하면 완료가.. 2020. 2. 26.