이아임의 블로그

jQuery에서 애니메이션을 주고 delay를 주고 난 후에 다른 애니메이션을 진행하고 싶은 경우가 있다.

그럴 때는
$("div").fadeIn(1000).delay(1000).fadeOut(1000);

이렇게 할 경우에는 div를 1초동안 점점 나타나게 한 후, 1초동안 기다렸다가 1초동안 점점 사라지게 하는 소스이다.

만약 여러가지 jQuery를 한번에 딜레이를 주고싶다면
setTimeout();을 사용하면 된다.

사용법은 간단하다.

setTimeout(function() { 
    $('div').fadeIn(200); 
    $('div').animate({marginLeft: '380px'}, 200); 
}, 200);
를  0.2초동안 점점나타나게 하고 margin-left를 380px를 준다 라는 의미다.

그걸 setTimeout으로 감싸고 맨 뒤에 숫자를 넣어주면
0.2초 후에 위에 소스를 진행해라 라는 뜻이다.

var obj = $("#id_name").offset();
을 하게 되면 id="id_name"을 가지고 있는 엘리먼트(태그)의 top과 left의 값을 가지고 오게 된다.

사용방법은
function id_offset_test(){
    var obj = $("#id_name").offset();

    console.log("Left : " + obj.left + ", Top : " + obj.top);
}

으로 사용하게 되면 된다

값을 바꿔주려면

var n = 10;
var top = obj.top + n;

이후에 css 변경이던가 animate를 사용해서 넣어주면 변경된 값이 들어가게 된다.

//삭제할경우
if (confirm("정말 삭제하시겠습니까?") == true){
    ....
    alert('삭제되었습니다');
}else{
    alert('삭제를 취소하셨습니다');
}

특정 문자열을 기준으로 자르는 함수
split();

ex) var str = "2017-11-10";
      var split_str = str.split("-");
      console.log(split_str['0'] + split_str['1'] + split_str[3]);

문자열 위치를 찾아서 가져오기

substring(시작위치, 종료위치);

ex) var str = "2017-11-10";
      var substring_str_year = str.substring(0, 4) // 0번째 위치부터 4번째 자리수 까지 자른다.
      var substring_str_month = str.substring(5, 7) // 0부터 시작이기 때문에 '-' 제외하고 5부터 시작
      var substring_str_day = str.substring(8, 10) // 0부터 시작이기 때문에 '-' 제외하고 8부터 시작
      console.log(substring_str_year  + substring_str_month  + substring_str_day);

비슷한 함수로 substr이 있다

substr(시작위치, 길이);

ex) var str = "2017-11-10";
      var substr_str_year = str.substr(0, 4) // 0번째 위치부터 4번째 자리수 까지 자른다.
      var substr_str_month = str.substr(5, 2) // 0부터 시작이기 때문에 '-' 제외하고 5부터 시작
      var substr_str_day = str.substr(8, 2) // 0부터 시작이기 때문에 '-' 제외하고 8부터 시작
      console.log(substr_str_year  + substr_str_month  + substr_str_day);

substring과 substr의 다른 점은 위에 예제를 써봤으면 한눈에 보인다

substring 같은 경우에는 ABCD 라는 문자열이 있을 때
substring(1, 3) 같이 사용하면 시작 위치 1번 인덱스인 B에서 시작해 3번 인덱스인 D에서 종료하게 되어서
출력 결과는 BC가 된다.

하지만 substr을 substring(1, 3) 같이 사용할 경우에는
시작위치에서 2개만큼 가져오라는 뜻으로 출력 결과는 BCD가 된다.

if($("#id_name").hasClass("확인할 클래스명") === true){
    echo "클래스 값이 있습니다.";
}else{
    echo "클래스 값이 없습니다.";
}