jquery 6

jquery :: select box 간 option 이동

첨부된 파일을 참고하세요. 당연히 jquery 파일 인클루드는 필수! var JSopt = { doOpt : function(_mode) { if(_mode == 'add') { // > // sel_list : 왼쪽셀렉트박스 id $("#sel_list").find("option").each(function() { if(this.selected){ // sel_list_sort : 오른쪽 셀렉트박스 id $("#sel_list_sort").append("" + this.text +""); $(this).remove(); } }); } else if (_mode == "addall") { // >> $("#sel_list").find("option").each(function() { $("#sel_lis..

Note/그밖에 2012.03.20

jquery :: 쿠키 플러그인

오늘하루 이창열지않기... 를 할때 보통 쿠키를 사용하죠. 쿠키를 사용하려면 setCookie / getCookie 함수를 선언하여 사용합니다. jquery를 이용하여 쉽게 쿠키를 get/set 할수있도록 해주는 플러그인이 있네요. 이것참....편합니다그려 허허 일단 jquery 기반이기 때문에 jquery를 기본으로 인클루드 해주고, jquery.cookie.js 파일을 프로젝트 폴더에 추가하고 인클루드 시켜줍니다. 1. 쿠키값을 가져올때 $.cookie("Cookie_name"); 2. 쿠키값을 셋팅할때 $.cookie("Cookie_name", "Cookie_Value"); $.cookie("Cookie_name", "Cookie_Value", { expires: 3 } );// 유효기간을 3일로 ..

Note/그밖에 2012.03.02

JQuery 엘리먼트 선택자

J쿼리 공식홈에서 가져옴 $("E F"); //E의 자손이면서 태그명이 F인 모든 엘리먼트와 일치 $("E>F"); //E의 바로 아래 자식이면서 태그명이 F인 모든 엘러먼트와 일치 $("E+F"); //E의 형제 엘리먼트로 바로 다음에 나오는 엘리먼트 F와 일치 $("E~F"); //E의 형제 엘리먼트로 다음에 나오는 모든 엘리먼트 F와 일치 $(":first-child");//첫번째 자식 엘리먼트. li:first-child는 각 리스트의 첫번째 아이템을 반환한다. $(":last-child");//마지막 자식 엘리먼트. li:last-child는 각 리스트의 마지막 아이템을 반환한다. $(":only-child");//형제가 없는 모든 엘리먼트 반환 $(":nth-child(n)");//n번째 자식..

Note/그밖에 2011.06.30

JQuery :: $(document).ready

$(document).ready 함수는 DOM 로드가 끝나고 이미지가 로드되기 전에 실행된다. 도큐먼트가 준비되었다는 의미로 생각하면 쉬울것 같다. 보통의 html 페이지에서 - 페이지 로딩시점에서. 엘리먼트 id에 접근하여 이벤트를 발생시키려면 사이에 스크립트를 삽입하는것이 아니라 id를 정의한 태그 아래쪽에 스크립트를 삽입해야한다. JQuery를 사용하여 $(document).ready 를 사용하면 에 스크립트를 삽입하여도 DOM 트리를 로드 한 후에 실행하기때문에 정상적인 실행이 가능하다. 사용법은 다음과 같다. $(document).ready(function() { //1번 $('table').css("width","800px"); //2번 $('#switcher').trigger('click')..

Note/그밖에 2011.06.30

jquery :: .hover() 이벤트의 활용

내가 좋아하는 j쿼리의 기능들중 한가지인 .hover() 에 대해서 소개해본다. 이름을 보시면 아시겠지만.. 마우스 오버했을때 발생하는 이벤트를 정의하는 것이다. 당연히 jquery 인클루드 해주고..... $(".test").hover( function(){ // 마우스오버되었을때 이벤트 alert("마우스 오버됨"); }, function() { // 마우스아웃되었을때 이벤트 alert("마우스 아웃됨"); } ); 여기 마우스를 올려보세요. test 라는 이름의 클래스를 가진 span 태으에 마우스가 오버되었을때를 정의한 스크립트이다. 그런데 자세히 보면.. function이 두개 있다. function() { }, function() { } 이렇게. function을 한개만 지정하면 마우스오버되었..

Note/그밖에 2011.01.03

About J Query

JavaScript Library :: J Query 말그대로 Jquery란 자바스크립트 라이브러리인데 라이브러리란 무엇이냐, 나는 사실 전문용어로는 잘 설명할 수 없다;; 하지만 쉽게말하자면 Jquery란 자바스크립트를 "좀 더 쉽게" 사용하도록 누군가가 만들어놓은, 일종의 텍스트로 구성된 프로그램인 것이다. 사용법은 아주 간단하다. Jquery홈페이지에서 Jquery파일을 다운받은 후 js파일처럼 인클루드하여 사용하면 된다. Jquery가 제공하는 여러가지 함수들이나 기능들은 Jquery가 설명된 교재들을 보시길 바란다. 그전에는 ProtoType을 사용했는데 Jquery로 갈아타니까 여간 편한게 아니다. 프로토타입은 id만을 선택할 수 있었던 반면,(물론 다른 엘리먼트를 선택불가능했다는것은 아니다)..

Note/그밖에 2010.03.23