브라우저에 element가 보이는지 체크하려면 다음과 같이 하면 된다. $(element).is(":visible") 출처: https://chobokkiri.tistory.com/43?category=656562 [초보끼리]

submit 하고 나서 동적으로 데이터를 삽입하여 변수를 서버로 전송할 때 동적으로 Param을 넘겨줄 때 다음과 같이 사용하면 된다. 선택자 "#form1" 은 태그의 ID 값을 임의로 넣은 것이다. var input = $("") .attr("type", "hidden") .attr("name", "mydata").val("bla"); $('#form1').append($(input)); 출처: https://chobokkiri.tistory.com/20?category=656562 [초보끼리]

jQuery Quick API 1. 제어 (1) 선택.add() : 요소를 추가 선택한다. $("p").add("div") // p 요소와 div 요소를 선택한다. .not() : 선택된 확장집합에서 인자에 해당하는 요소를 제거한다.$("p").not(".green") // p 요소의 확장집합에서 class가 green인 요소를 제거한다. .children() : 요소의 고유한 자식으로 구성된 확장 집합을 반환한다. .contents() : 선택한 요소의 자식 요소를 가져온다.(text node 포함)$('.container').contents().filter(function(){}); // class container 요소의 자식요소(text 포함)를 가져와 filter 한다. iframe text를 ..

jQuery Plugin을 이용한 form validation 1. 다운로드http://jqueryvalidation.org 에서 Download를 클릭해서 파일을 다운받습니다. 2. 인크루드 파일 및 설명 jquery.validate : 검증플러그인 (필수)cf.) jQuery 버전은 jquery-1.7.2이상에서 동작되는 거 확인되었습니다. 그 이하는 저도 잘 모릅니다. 한번 확인해보세요! 3. HTML 코드작성자E-mailcellphone제목문의내용비밀번호등록취소 4. 스크립트 코드$(document).ready(function() { $("#frm").validate({ //validation이 끝난 이후의 submit 직전 추가 작업할 부분 submitHandler: function() { va..

dataType속성을 이용한 JSON 데이터 가져오기 1. 다운로드.json 파일 자체는 json 데이터라서 따로 변환 작업을 불요하나, 자바에서는 자바데이터를 JSON 데이터로 변환하는 작업이 필요하다. 해당작업을 하기 위해서는 아래의 jar 파일을 다운받자.https://code.google.com/p/google-gson/downloads/detail?name=google-gson-2.2.4-release.zip에서 파일을 다운받는다.--> 해당 JSP 파일에 추가 2. 파일내용(1) test3.html 프로그래머 디자이너 PM 고객 ajaxReturnOutput (2) test3.jspJSON 라이브러리는 다양하게 존재하는 것 같다.하지만, 사용법은 크게 벗어나지는 않는다. 각각의 라이브러리의 메..

jQuery를 이용해 JSON 데이터 가져오기 1. 준비 파일base.css은 필수 파일이 아님. 2. 각 파일 내용(1) ex1.json[ { "term": "BACCHUS. 바쿠스", "part": "명사.", "definition": "고대인들이 술에 취할 명분으로 편의상 만들어낸 신.", "quote": [ "꼴딱꼴딱 마실수도 있고,", "꿀꺽꿀꺽 마실수도 있다.", "술독에 빠져 줄곧 마시기도 하고", "찔끔찔끔 마시다 밤새 마시기도 한다." ], "author": "애주가" }, { "term": "BACKBITE. 험담하다", "part": "동사.", "definition": "상대방에게 들킬 염려가 없을 때, 그에 관해 본 그대로를 입에담다." }, { "term": "BANG. 빵! 가..

Ajax 데이터통신 기본 1. 파일 내용(1) test.html 글번호 아이디 코멘트 ajaxReturnOutput (2) test2.jsp 글번호: 아이디: 코멘트: 실행결과)버튼 클릭시 출력되는 예제이다. cf.) serialize() 예제 반복횟수 아이디 코멘트 beforeParameter ajaxReturnOutput 출처: https://devbox.tistory.com/entry/jQuery-jQeury를-이용해-JSON-데이터-가져오기?category=578062 [장인개발자를 꿈꾸는 :: 기록하는 공간]

문서 준비 이벤트 jQuery(document).ready(function(){ code });=jQuery(function(){ code });=$(function(){ code }); jQuery에서 문서 준비 이벤트는 웹 브라우저가 HTML의 DOM을 모두 로드할 때를 알려주는 이벤트로, 태그에 jQuery 코드를 삽입할 경우에는 문서 준비 이벤트를 반드시 사용하여야 한다.에 jQuery 코드를 넣을 때에는 문서 준비 이벤트가 필요하다. 문서 준비 이벤트는 ready이다. HTML을 동적으로 조작하기 위해서는 HTML 문서를 모두 로딩해야만 그 다음에 동작을 가하는 jQuery나 JavaScript 코드가 정상적으로작동된다. jQuery에는 ready 이벤트와 똑같은 효과를 나타내는 것이 있는데, ..

Ajax 설정 cp.) 요청 매개 변수와 함께 Ajax 요청을 수행한다. data 속성을 사용하면 요청 매개 변수를 쉽게 지정할 수 있다. $ajax() 메서드의 옵션 객체에 url 속성을 입력하고 data 속성에 객체를 입력한다.ex.) url: 'Home/ActionWithData'. data: name:'rintiantta',age:21, success: function(data) .......이렇게 하면 http://localhost:8080/Home/ActionWithData?name=rintiantta&age=21로 Ajax 요청을 수행한다. 1. $ajax 설정값 (1) url HTTP 요청을 할 대상이되는 url단순히 html 페이지에 대한 주소가 될 수도 있고 WCF.ASMX 서비스에서 ..

Ajax 기초 1. Ajax란?- Asynchronous JavaScript and XML 의 약자- 자바스크립트를 이용해서 비동기식으로 서버와 통신하는 방식. 이 때 XML을 이용한다.- 꼭 XML을 이용할 필요는 없고, 최근에는 json을 더 많이 이용한다.- 비동기식이란 여러가지 일이 동시적으로 발생한다는 뜻으로, 서버와 통신하는 동안 다른 작업을 할 수 있다는 의미. 2. 선행지식- 폼 3. $.ajax(settings)- jQuery를 이용한 ajax통신의 가장 기본적인 API- 주요속성 data : 서버에 전송할 데이터, key/value 형식의 객체 dataType : 서버가 리턴하는 데이터 타입 (xml, json, script, html) type : 서버로 전송하는 데이터의 타입 (PO..