목록jQuery (9)
오늘이라도
[Web] 25. ajax 통신을 이용한 json 출력 / xml 출력 / jsp 접근
https://github.com/upcake/Class_Examples 교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. gif 파일은 클릭해서 보는 것이 정확합니다. - ajax 통신을 이용한 json 출력 - 광주광역시 버스 노선정보 여기에 버스 노선정보가 출력됩니다. ▲test02_jq05~11.html : 방법 ① - jsp를 통해서 json 파일을 만든 뒤 읽어오는 방법 - 번거롭지만 CORS 오류가 발생하지 않는다는 장점이 있다. 광주광역시 버스 노선정보 여기에 버스 노선정보가 출력됩니다. ▲test03_jq05~11.html : 방법 ② - 공공 API JSON에 바로 접근해서 뿌리는 방법 ▲gjbus.jsp package com.hanul.study; import java.net.U..
[Web] 24. toggleClass, JSON을 jQuery로 읽기, ajax 통신
https://github.com/upcake/Class_Examples 교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. gif 파일은 클릭해서 보는 것이 정확합니다. - JSON, ajaxtoggleClass, JSON을 jQuery로 읽기, ajax 통신 - 클릭하세요! 안녕하세요 ▲jq07_toggleClass.html [ {"Num" : 1, "Name" : "홍길동", "Addr" : "서울시 강남구 개포동"}, {"Num" : 2, "Name" : "홍길동", "Addr" : "서울시 강남구 삼성동"}, {"Num" : 3, "Name" : "홍길동", "Addr" : "서울시 강남구 역삼동"}, {"Num" : 4, "Name" : "홍길동", "Addr" : "서울시 강남구 청담동"..
7. 움직이는 패널 만들기
https://github.com/upcake/Class_Examples 교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. gif 파일은 클릭해서 보는 것이 정확합니다.
6. jQuery UI Plugin
https://github.com/upcake/Class_Examples 교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. gif 파일은 클릭해서 보는 것이 정확합니다. - https://jqueryui.com/ jQuery UI jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQue jqueryui...
5. hide, show, toggle, fade in, out, toggle, to, animate, pause, resume, stop
https://github.com/upcake/Class_Examples 교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. gif 파일은 클릭해서 보는 것이 정확합니다. - $('요소선택').hide("효과속도", 콜백함수) : 노출되어 있는 요소를 숨긴다. - $('요소선택').show("효과속도", 콜백함수) : 숨겨져 있는 요소를 노출시킨다. - $('요소선택').toggle("효과속도", 콜백함수) : show() 메서드와 hide() 메서드를 번갈아 실행한다. - 콜백함수 : 효과가 모두 완료되면 실행되는 함수, 생략 가능하다. - 효과속도 : fast, normal, slow, 밀리초(1/1000) - $('요소선택').fadeIn("효과속도", 콜백함수) :숨겨져 있던 요소가 점점 선명..
4. index, append, empty, 이벤트 등
https://github.com/upcake/Class_Examples 교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. gif 파일은 클릭해서 보는 것이 정확합니다. - selectedIndex : 선택된 값의 인덱스 번호 - append() : 선택한 요소의 마지막 위치에 새 요소를 추가 - prepend() : 선택한 요소의 맨 앞 위치에 새 요소를 추가 - appendTo() : 새 요소를 선택한 요소의 마지막 위치에 추가 - prependTo() : 새 요소를 선택한 요소의 맨 앞 위치에 추가 - empty() : 내용물을 삭제 - remove() : 태그를 삭제 - click() : 클릭 이벤트가 생길 때 작동하는 메서드 - dblclick() : 더블 클릭 이벤트가 생길 때 작동하는 ..