IT News/jQuery24 jquery each 에서 시간 간격(interval) 효과를 사용해보았습니다. jquery 를 사용하면서 선택된 여러개의 데이터들을 한번에 이벤트를 주는 경우가 있습니다. 예를 들어서 smsCheck 라는 클래스 이름을 가진 체크 박스가 있다고 생각해 보십시오. 그리고 선택된 체크박스에 대해서만 a 태그로 된 sendSMSBtn 클래스를 가진 버튼이 있다고 생각해 보십시오. 그러면 이 때 선택된 체크박스에 대해서만 해당 테이블 같은 라인에 있는 버튼을 일괄적으로 클릭 이벤트를 발생시켜 보겠습니다. 그런데 문제점은 각 클릭된 이벤트들이 순식간에 일어났을 경우가 문제 입니다. 서버에서는 동시에 여러개의 ajax 관련 내용이 실행이 된다고 했을 경우에 문제가 될 여지가 있어 보입니다. 따라서 jqury를 사용할때 each 문장에서 각 개별적으로 이벤트를 시간적으로 여유를 두고 클릭 이벤.. 2022. 3. 3. javascript browser detection 자바스크립트 브라우저 체크 및 확인 가끔씩 브라우저별로 따로따로 처리해야할 경우가 생기기도 하는데요. 그러한 경우를 생각해서 각 브라우저를 알아낼 수 있는 방법을 소개합니다. 자바스크립트로 브라우저 알아내기 또는 브라우저 확인 으로 검색을 하다가 드디어 찾아낸 방법입니다. 저와같이 헤매지 마시고 조금 이나마 시간을 아끼시길 바래요~ 소스코드는 아래와 같습니다. var agent = navigator.userAgent.toLowerCase(); if (agent.indexOf("chrome") != -1) { alert("크롬 브라우저입니다."); } if (agent.indexOf("safari") != -1) { alert("사파리 브라우저입니다."); } if (agent.indexOf("firefox") != -1) { alert(".. 2019. 5. 31. 자바스크립트에서 문자열을 검색해서 변경할때에 변수를 이용하여 변경하는 방법, 정규식을 이용하여 모든 문자열을 검색하는 방법을 소개합니다. 아래의 스크립트 예제는 id 값이 orignText 라는 textarea 의 내용을 가져와서 transArray 에 있는 과일의 이름을 찾아서 해당 과일 이름에 * 표시를 추가하여 넣는 기능을 구연해 본 예제입니다. 여기에서 핵심은 테스트를 찾아서 변경하는 부분인데요. 일반적으로 하나의 텍스트만 변경을 하지만 텍스트의 모든 내용을 검색해서 변환하는 방법을 구현해 보았습니다. 또한 공백을 제외한 입력된 텍스트의 길이 계산하는 방법도 표현해 보았습니다. 자바스트립트 배열과 문자열을 찾아서 변경하는 부분과 정규식을 이용한 문자열 검색 부분에서 조금이나마 도움이 되셨으면 좋겠습니다. 위의 예제에서 처음에 나오는 부분은 아래와 같습니다.$('#orignText').keyup(function (event) { //.. 2018. 12. 11. [javascript and jQuery] input keypress vs keyup 차이점 및 입력 알아보기 html 문서중에서 input 태그를 사용하는 경우에 키보드 입력이 될 경우에 처리해야할 경우가 많은데요. 특별한 키가 입력되었다 하였을때.. 예를 들어 엔터키가 눌러졌을 경우에 전송 버튼 누른 효과를 한다든지.. 또는 입력되는 값을 조절을 할 경우가 생깁니다. 예를 들어서 주민번호를 예를 들어 설명해 본다면요.. 물론 요즘엔 주민번호 입력은 않되기 때문에 회사 사원번호라고 생각하고 설명해 드리겠습니다. - 위와 같은 input 태그가 있다고 있다고 생각해 보면, 앞의 input 에는 6자리.. 그리고 뒤의 input 에는 7자리로 된 값을 입력받도록 스크립트로 제한을 한다면 어떻게 해야할까요? 우선은 숫자만 입력 받도록 하기 위해서 input 태그는 타입을 number 로 하였습니다. 그리고 이제는 자.. 2017. 12. 18. image upload with jQuery and Ajax and return Value is json (ajax 이미지 업로드) jQuery 를 이용하여서 title, type, 그리고 이미지 파일을 한개 전송을 한다고 했을때 그것도 aJax를 통해서 말이죠... 적용하느라 하루 이상이 걸렸는데요. 아무튼 여기서 핵심은 FormData 를 생성하고.. 첨부된 파일 정보를 줘야 합니다. 그리고 processData 와 contentType 값을 false 로 해야합니다. 참고로 datatype 를 json 으로 한 이유는 반환받는 값을 json 형태로 값을 인식하기 위함입니다. 이것은 꼭 않하셔도 됩니다. 아래의 예제는 핵심되는 ajax 파일 부분만 있으니 참고만 하시면 될것 같습니다. var currentDlg = $('#add_dialog'); var title = currentDlg.find('#title').val(); va.. 2017. 11. 9. a 태그 클릭시 스크롤 에니메이션 효과 jQuery a 태그를 클릭했을때 본문에 위치한 id 값으로 스크롤 되어 이동이 되는데요. 문제는 스크롤이 찰나?에 바로 되기 때문에 스크롤 되는 효과를 보기 어렵습니다. 그래서 아래의 jQuery 소스 코드를 첨부하면 됩니다. 참고로 $('.menuInfo > a') 이 부분은 자신에 소스 코드에 맞게 수정하시면 됩니다. var $root = $('html, body');$('.menuInfo > a').click(function() { $root.animate({ scrollTop: $( $.attr(this, 'href') ).offset().top }, 500); return false;}); 2017. 9. 16. 이전 1 2 3 4 다음