Post

모바일 스크롤막기
방법 1번
바디 스크롤 방지 : $("body").bind('touchmove'function(e){e.preventDefault()});
바디 스크롤 해제 : $("body").unbind('touchmove');
방법 1번 사용방법

$('셀렉트').on('click',function(e){

e.preventDefault();

$(팝업창).fadeIn();

$("body").bind('touchmove'function(e){e.preventDefault()});

});

방법 1번 해제방법

$('셀렉트').on('click',function(e){

e.preventDefault();

$(팝업창).fadeOut();

$("body").unbind('touchmove');

});



방법 2번
스크롤 방지  : $('html, body').on('scroll touchmove mousewheel', function(event) {
event.preventDefault();
event.stopPropagation();
return false;
});
스크롤 해제 :  $('html,body').off('scroll touchmove mousewheel');



방법 2번 사용방법

$('셀렉트').on('click',function(e){

e.preventDefault();

$(팝업창).fadeIn();

$('html, body').on('scroll touchmove mousewheel', function(event) {

event.preventDefault();

event.stopPropagation();

return false;

});

});


방법 2번 해제방법

$('셀렉트').on('click',function(e){

e.preventDefault();

$(팝업창).fadeOut();

$('html,body').off('scroll touchmove mousewheel');

});



'javascript, jQuery' 카테고리의 다른 글

iframe 접근방법  (0) 2018.03.23
자바스크립트 즐겨찾기  (0) 2018.03.21
가장 많이 쓰이는 벨리데이션  (0) 2018.03.21
모바일기기 인식 스크립트  (0) 2018.03.21
콤마 추가 및 제거  (0) 2018.03.21

Post

벨리데이션
★ 한글만 가능
var regKo= /[\ㄱ-ㅎㅏ-ㅣ가-힣|\u119E\u11A2,^\s+|\s+$]+$/gi;
★ 영문만 가능
var regEn = /^[a-zA-Z]+$/; 

★ 한글 영문만 가능
var regName = /^[가-힣a-zA-Z]+$/; 

★ 숫자,알파벳만 가능
var regId = /^[a-zA-Z0-9]+$/;

★ 숫자 영문 특수문자만 가능
var regPw = /^(?=.*[a-zA-Z])(?=.*[!@#$%^*+=-])(?=.*[0-9]).{5,12}/; 

★ 이메일 
var regEmail = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/; 

★ 전화번호
var regTel = /^[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}$/; 

★ 도메인 형태, http:// https:// 포함안해도 되고 해도 되고
var regDomain = /^(((http(s?))\:\/\/)?)([0-9a-zA-Z\-]+\.)+[a-zA-Z]{2,6}(\:[0-9]+)?(\/\S*)?$/;

★ 도메인 형태, http:// https:// 꼭 포함
var regDomain2 = /^((http(s?))\:\/\/)([0-9a-zA-Z\-]+\.)+[a-zA-Z]{2,6}(\:[0-9]+)?(\/\S*)?$/;


사용법 
변수명.test($(셀렉트).val());

'javascript, jQuery' 카테고리의 다른 글

자바스크립트 즐겨찾기  (0) 2018.03.21
레이어 팝업시 스크롤 터치스크롤 막기  (0) 2018.03.21
모바일기기 인식 스크립트  (0) 2018.03.21
콤마 추가 및 제거  (0) 2018.03.21
웹접근성 gnb메뉴  (0) 2018.03.21

Post

UserAgent를 통한 모바일 인식 자바스크립트 - 모바일 테블릿 pc 인식

if(navigator.userAgent.match(/Mobile|iP(hone|od)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //스마트폰일 때 실행 될 스크립트

}

User agent에는 사용자 기기에대한 정보도 들어있기 때문에, 모바일환경을 인식할 수 있습니다.

위의 코드를 사용하면 태블릿을 제외한 스마트폰에서만 스크립트를 실행할 수 있습니다.



if(navigator.userAgent.match(/Android|Mobile|iP(hone|od|ad)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //모바일(스마트폰+태블릿)일 때 실행 될 스크립트

}

이 코드는 안드로이드 태블릿과 아이패드 정보가 추가된 스크립트입니다.





만일 모바일을 제외한 PC에서만 실행할 스크립트는 다음처럼 작성하면 됩니다.

if(!navigator.userAgent.match(/Mobile|iP(hone|od)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //태블릿,PC에서만 실행 될 스크립트

}

if(!navigator.userAgent.match(/Android|Mobile|iP(hone|od|ad)|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/)){

  //PC에서만 실행 될 스크립트

}


▲ top