JavaScript & jQuery18 jQuery - 동적페이지 클릭 이벤트 발생 안됨 해결법 및 이벤트 적용 대처 방법 들어가며 기존에 사용하던 제이쿼리 클릭 이벤트가 동적 페이지로 변경되면서 작동이 하지 않아 그에 따른 해결 방법과 해결 방법의 적용 결과로 기존 제이쿼리 이벤트 처리 방법에 대한 대처 방법을 정리한다. 클릭 이벤트 미발생 해결법 위에서 말한 것처럼 보통 제이쿼리 클릭 이벤트 사용시에는 다음과 같이 사용한다. $('#id').click(function(){ //구현내용 }) 하지만 이 방법을 사용하면 동적페이지로 변경되는 순간 동일한 id를 대상으로 이벤트가 적용되지 않는다. 해결 방법으로는 아래와 같이 사용하면 된다. $(document).on("click", "#id", function(){ //구현내용 }); 원인은 $(document).ready를 사용해서인것 같다. 기존 제이쿼리 이벤트 대처 방법.. 2021. 12. 9. jQuery - 동적으로 CSS 속성 추가하기 jQuery - 동적으로 CSS 속성 추가하기 기존에 하나씩 css의 속성을 추가할 일만 있었는데 여러개 속성을 추가할 일이 생겼다. 속성 갯수가 적다면 상관없지만 많다면 기존방법으로 여러번하는 일은 비효율적이라 방법을 찾아봤는데 아주 간편한 방법이 있어 정리한다. 속성 1개 추가 속성이 하나 뿐일때는 다음과 같이 간편하게 가능하다. $('#test').css('display', 'none'); 속성이 여러개 이때는 위 방법같이 하게 된다면 속성에 갯수에 따라 코드라인이 증가하며 가독성도 떨어트리게 될 것이다. 아래와 같이 css에 적용된 class 자체를 넣어준다. jQuery $("#test").attr({ "class" : "testClass" }); Document document.getEleme.. 2021. 9. 17. JavaScript - 10진수 -> 2진수, 8진수, 16진수 변환 JavaScript - 10진수 -> 2진수, 8진수, 16진수 변환 HEX값을 RGB 값으로 변경하는 과정에서 다른 진수도 정리해둔다. 자바스크립트에서는 Number 객체에 내장 함수인 toString() 함수와 전역 함수인 parseInt() 함수를 제공한다. - 10진수를 진수 변환할때는 Number객체의 내장 함수인 toString()을 사용 - 10진수 외의 다른 진수를 10진수로 변환할때는 전역 함수인 parseInt()을 사용 // 1. 10진수 -> 2진수 let 십진수 = 125; console.log(`1. 10진수(${십진수}) -> 2진수(${십진수.toString(2)})`); // 1111101 // 2. 10진수 -> 8진수 console.log(`2. 10진수(${십진수}) .. 2021. 9. 3. js - click & dbclick 동시 사용 방법 js - click & dbclick 동시 사용 방법 이벤트를 적용하다보면 같은 대상에 클릭과 더블클릭 이벤트를 적용해야되는 일이 생긴다. 이때 $('#id').click 과 $('#id').dbclick 과 같이 이벤트를 따로 선언해서 사용하면 더블클릭 이벤트가 처리가 안된다. 해결방법은 on() 함수와 타이머관련 함수들을 이용하여 해결이 가능하다. Code 코드는 다음과 같다. 설명 먼저 클릭할 대상을 만든다. 제이쿼리를 이용하여 클릭 이벤트와 더블클릭 이벤트를 선언해준다. 클릭 이벤트 발생시 클릭카운트를 증가시켜 클릭 한번시 if문이 실행되며 setTimeout 함수를 통해서 Click 함수가 실행 후 다시 카운트를 0 으로 만든다. 더블클릭 이벤트 발생시 기존 더블클릭 이벤트는 preventDef.. 2021. 8. 26. ES6 - Fetch문과 Ajax 정리 ES6 - Fetch문과 Ajax 정리 Fetch문에 대해서만 정리를 하려 했지만 Fetch문이 Ajax 방식 중 하나이므로 Ajax에 대한 개념도 같이 정리하고자 한다. 처음에 배울때는 제이쿼리에 ajax() 메소드가 ajax방식에 전부인줄 알았던 것이 생각이 난다.. 여튼 혹시 나와 같이 생각하는 사람이 있다면 이 글을 보고 생각 정리에 도움이 됐으면 한다. 웹 프로젝트를 진행하다보면 클라이언트와 서버 간 데이터를 주고 받기 위해 http 통신을 한다. 이때 비동기 통신을 해야될때도 있는데 예를 들어서 상품 리스트가 있다고 할때 상품에 좋아요 기능이 있다고 하자. 좋아요를 누르게되면 좋아요 카운트가 증가하던지 아니면 하트 모양등의 색이 변해야 되는데 이때마다 페이지가 갱신이 된다면 많이 불편할 것이다.. 2021. 8. 12. JavaScript - toFixed() 함수로 인한 타입에러 JavaScript - toFixed() 함수로 인한 타입에러 소수점 둘째자리까지 반올림을 하기위해 toFixed()함수를 찾아서 쓰고 있는데 타입에러가 나와서 기록한다. toFixed() 메서드 toFixed()는 입력받은 숫자를 매개변수만큼 자리수를 반올림해 String으로 반환해주는 함수이다. 만약 toFixed(2)라고하면 소수점 둘째자리까지 반올림해서 나태내준다. 이와 같이 toFixed 함수는 숫자형 타입에 사용을 하고 그 반환값으로 String 타입으로 반환해주는 것이기 때문에 타입에러가 났다는 것은 숫자형타입이 아닌 다른 타입에 사용했기 떄문에 나타나는 오류인 것이다. 이러한 오류가 나타나게 된 배경으로 객체에 담긴 값을 사용하다가 일어난 오류이다. 우선 자바스크립트는 자바와는 다르게 느스.. 2021. 8. 5. 이전 1 2 3 다음
