# JQuery 썸네일형 리스트형 폼 유효성을 확인하는 방법 01. 필수항목이 입력이 되었는지 확인 $('.error').hide(); $('.submit').click(function(event){ var data = $('.infobox').val(); var len = data.length; if(len < 1){ $('.error').show(); event.preventDefault(); }else{ $('.error').hide(); } }); 1. 처음엔 Error 메시지는 숨기고 Click Event 는 Submit 버튼에 연결 2. Click Event 의 이벤트 처리함수에서 Text Field 에 입력된 데이터 추출 data 변수에 저장 3. Data 의 길이를 구하여 IF문으로 구분 하여 처리 / preventDefault() 메소드는 subm.. 더보기 이벤트 처리 2 12. 이미지 기반의 롤오버 ------------------------- image 관련 CSS ------------------------- .link{ display:block; width:170px; height:55px; background-image:url(btn1.bmp); background-repeat:no-repeat; background-position:top left; } .hover{ display:block; width:200px; height:70px; background-image:url(btn2.bmp); background-repeat:no-repeat; background-position:top left; } .active{ display:block; width:170p.. 더보기 이벤트 처리 1 1. 어느 버튼을 클릭했는지 확인하기 bind ( eventType, data, handler ) evnetType : 이벤트 타입지정 문자열, click, double-click, focus, blur data : 이벤트 핸들러에 전달할 데이터. 생략하면 두번째 변수는 핸들러 함수가 됨. handler : 이벤트 발생시 수행할 문장을 가진 함수. $('.bold').bind('click', function (){ >> 클래스 이름이 bold 인 span 엘리먼트에 대한 클릭 이벤트 핸들러 .click ( handler ) // .click() >> 클릭 이벤트 핸들러 .dblclick ( handler ) // .dblclick() >> 더블클릭 이벤트 핸들러 # 이벤트 객체의 target 속성을 사용.. 더보기 배열 관련 1. 배열을 사용하여 리스트로 표현하기 $(document).ready(function(){ var memlist = $("#list"); var members = ["John","Steve","Ben","Damon","Ian"]; $.each(members.function(index,value){ memelist.append($("" + value + "")); }) }); ======================================================== John Steve BenJohn Damon Ian ======================================================== $('p').text(members.join(",")); >> TEXT Joi.. 더보기 JQuery....... Start 1. jQuery는 경량의 오픈 소스 자바스크립트 라이브러리의 이름. 2. prototype이나 ExtJs, Dojo 등과 유사한 스크립트 라이브러리, 스크립트 프레임워크라고 보면 된다. 3. 리치 웹, Ajax등... 신(新) 라이브러리 라고 보며 세계적으로 가장 많이 사용되는 라이브러리로 자리를 잡고 있다. 4. 내용 확인 : http://www.rubyrailways.com/rails-rumble-observations-part-i-jquery-on-the-heels-of-prototype/ 5. 참고 확인 : http://www.quarkruby.com/2007/11/6/why-i-moved-from-prototype-to-jquery. “Why I moved from Prototype to jQ.. 더보기 이전 1 다음
