jQuery17 JQuery 호환성 확보 JQuery 2.x 기반으로 작업을 했더니 몇몇 기능이 안된다는 문의가 들어왔다. 아무래도 이용 중인 브라우저 버전이 낮아서 그럴 것 같아서 호환성 문제를 찾아보니 역시나 JQuery 2.x에서 IE8 이하를 지원하지 않아서 발생하는 문제같다. 마이그레이션을 설치하면 된다고 하여 설치해 보았다. https://github.com/jquery/jquery-migrate/#readme 일단 클릭해도 드롭다운메뉴가 나오지 않는 문제, 카트 버튼을 눌러도 카트에 담았습니다...라는 경고창이 안뜨는 문제는 해결. 아래의 코드도 삽입해서 버전별로 분기하도록 처리. 2016. 5. 25. jQuery, Ajax로 한 페이지에 있는 여러 개의 폼을 전송하기 (쇼핑몰 상품 목록의 경우) How to submit multiple forms in a same page with jQuery/Ajax and get multiple return values via json. (e-commerce site) 쇼핑몰에서 고객이 상품을 장바구니에 담고 그 값을 다른 페이지에서 처리한 뒤 다시 상품 페이지로 돌아가 페이지가 리프레시된다면 썩 좋은 방법은 아니다. (아니면 같은 페이지에서 DB 처리를 할 수도 있겠지?)그래서, 화면을 리프레시하지 않고 어떤 결과값을 받아오기 위해 사용되는 것이 ajax다. 위의 그림에서 보듯이 상품목록에는 여러 개의 form 값이 들어가게 된다.이걸 ajax로 전송하려면 어떻게 해야할까?그리고 여러 개의 결과값을 받으려면 어떻게 해야할까?구글링을 하다가 몇 가지 힌트를 .. 2014. 8. 16. [jQuery] 기본 문법 정리 jQuery는 정말이지 내게 어렵다.제대로 공부한 적도 없지만 어떻게 사용하는지 봐도 잘 모르겠다...ㅋ [jQuery] 기본 문법 정리 2013. 12. 30. 모바일 웹앱의 현주소 http://www.imaso.co.kr/?doc=bbs/gnuboard.php&bo_table=article&wr_id=40425 2013. 12. 30. 이미지를 모바일 해상도에 맞게 조절하기 기존 PC에서 사용하던 이미지를 재가공하지 않고, 모바일웹의 화면에 맞게끔 이미지 사이즈를 변경할 수 있는 방법이 뭐가 있을까???구글링을 해봤지만 마땅한 해법을 찾지 못하고 있었는데, Jquery mobile demo 페이지에서 아주 간단한 답을 찾았다.바로 태그 에 "width=100%" 속성을 추가하는 것이다.효과만점에 아주 간단하면서도 모바일웹에서 쉽게 사용할 수 있다. 2013. 10. 11. [jQuery mobile] back 버튼을 누르면 강제로 refresh 하기 jQuery mobile에서 뒤로가기 버튼을 누르면 이미 DOM에 포함이 되어버려 화면갱신이 되지 않는다. 경우에 따라 화면을 강제로 갱신할 필요가 있을 경우 아래와 같이 작성하고 자바스크립트 파일에 추가한다. (주문상세내역을 확인한 후 다시 주문목록으로 돌아갈 때, 그 사이 새로운 주문이 있는지 또는 확인한 주문내역을 상태가 변경된 것을 목록에서 나타내기 위해 화면을 갱신할 때 사용했다.) 하단은 모든 페이지의 뒤로가기 버튼에서 사용할 때,$(document).on("pagehide", "div[data-role=page]", function(event){ $(event.target).remove(); }); 하단은 특정 페이지에서만 동작하도록 할 때 사용한다. $(document).on("pagehi.. 2013. 4. 5. [고급] AJAX 데이터베이스 예제 AJAX를 데이터베이스와 함께 사용하면 좀 더 상호적일 수 있다. AJAX 데이터베이스 예제 다음의 예제는 AJAX 기술을 이용해 데이터베이스로부터 정보를 얻어오는 방법에 대해 보여준다. (데모 실행하기) AJAX 예제 설명 예제는 단순한 HTML 폼과 자바스크립트 연결을 포함하고 있다. Select a Customer: Alfreds Futterkiste North/South Wolski Zajazd Customer info will be listed here. 위에서 볼 수 있듯이 "customers"라는 드롭다운박스와 간단한 HTML 폼으로 되어 있다. 폼 아래의 는 웹서버로부터 정보를 얻어와 보여주는 자리이다. 사용자가 데이터를 선택하면, "showCustomer()" 함수가 실행된다. 이 함수는.. 2009. 8. 4. [고급] AJAX 제시어 소스코드 제시어 예제를 위한 AJAX 소스 코드 아래의 소스 코드는 앞서 살펴봤던 AJAX 예제이다. 복사 후 붙여넣기를 통해 시도해 볼 수 있다. AJAX HTML 페이지 HTML 페이지이다. 간단한 HTML 폼과 자바스크립트 연결을 포함하고 있다. First Name: Suggestions: (*주: txt1이라는 입력 필드에 이름을 입력하면 사용자 모르게 서버에 요청을 하고 서버에서 다시 제시어 값을 되돌려주면 txtHint 영역에 제시어가 나타나는 예제이다. AJAX의 원리에 대해 모른다면 2009/07/28 - [AJAX] - [기초] AJAX 튜토리얼 시리즈부터 먼저 살펴보자.) AJAX 자바스크립트 "clienthint.js" 파일로 저장한 자바스크립트 코드이다. var xmlhttp function.. 2009. 8. 3. [고급] AJAX 제시어 예제 원문 : AJAX Tutorial AJAX는 보다 인터랙티브한 응용프로그램을 만드는데 쓰일 수 있다. AJAX 제시어 예제 다음의 AJAX 예제는 사용자가 HTML 폼에 데이터를 입력하는 동안 어떻게 웹 페이지가 웹 서버와 통신하는지를 보여준다. (데모 실행하기) 예제 설명 - HTML 폼 위 데모 폼은 아래 소스와 같이 구성되어 있다. First Name: Suggestions: "txt1" 이라는 입력 필드를 가진 단순한 HTML 폼이다. 입력 필드를 위한 이벤트 속성은 onkeyup 이벤트일 때 동작하는 함수를 정의하고 있다. 폼 밑의 문단에서는 "txtHint"라는 span을 포함하고 있다. 이 span은 서버로부터 데이터를 받아 보여주는 역할을 한다. 사용자가 데이터를 입력했을 때 "showHi.. 2009. 8. 3. 이전 1 2 다음