개발

[에러] Uncaught TypeError: Cannot read properties of undefined (reading 'split')

Uncaught TypeError: Cannot read properties of undefined (reading 'split') 오류가 뜨는경우데이터 값이 정의된게 없는데(undefined) split을 실행시켜서 생기는 오류이다.  해결방법이 경우 (sUrl || "")  처럼 변수값이 없는 경우도 포함시켜주면 오류가 나지 않는다. 수정전var aUrl = sUrl.split('?');  수정 후var aUrl = (sUrl || "").split('?');

[CSS/jQuery] 크기가 다른 Grid item 자동 정렬 하기

Grid 기본코드 Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item 7   특정 칸만 크기 조절특정 박스만 크기를 다르게 하고 싶다면  grid-column-end (행 크기 조절),  grid-row-end (열 크기 조절) 를 이용해 조절하면 된다. 아래의 경우에는 big class를 가진 박스는 가로 3칸중 2칸, 세로로도 2칸씩 차지하도록 하였다. Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item 7      그런데 특정 박스만 크게 하는 경우에, 상황에 따라 여백이 생기는 경우가 있다.아래 경우에는 Grid를 3칸으로 하였는데, 3n번째 크기를 다르게 하..

[php] explode 배열 최소값, 최대값 구하기 min(), max()

explode 배열 최소값, 최대값 구하기 보통 데이터가 array 배열로 되어있으면 min(), max()함수를 써서 바로 최소값 최대값을 구할 수 있다.$arr = array(1,2,3,4,5,6,7); $price1 = min($arr);$price2 = max($arr);  하지만 데이터가 이미 구분자로 합쳐서 들어가져있다면 (예 : 100000|1500000|200000|130000)배열로 변경한 후에 최소값, 최대값을 구할 수 있다.$str = $view['sp_price'];$sub_str = explode("|", $str);$new_str = array();foreach ( $sub_str as $row ) { $arr = explode( ',', $row );}echo min($a..

[카페24] 상품 분류, 게시판 스킨별 스크립트, CSS 다르게 적용하기

상품 분류마다 다르게 보여주기상품 분류 스킨은 동일한데 특정 일부분만 다르게 보여지게 하고 싶은 경우아래 스크립트를 상품 목록파일(/product/list.html)에 로드되는 /js/module/product/menucategory.js 파일에 추가해주면 된다.var urll = window.location.href;var urlParams = new URL(urll).searchParams;var cate_no = urlParams.get('cate_no');if(cate_no =="54") { //54번 카테고리 분류에 보여질 스크립트}  [사용예시] 나의 경우에는 카테고리별 설명문구를 추가해주기 위해 아래와 같이 코드를 넣었다.상품분류페이지에서 간단한 분류 설명은 넣을 수는 있지만 3~4줄 ..

[php] DB 텍스트 특수문자 (<, >, &, ", ' 등) 인식 / html 변환

DB 데이터 자체에는 특수문자를 포함한 데이터가 잘 들어가지는데, 불러올 때 꺽쇠나 특수문자가 들어간 부분은 삭제되고 보여지는 오류가 있어 해결할 수 있는 방법을 알아보았다.를 태그로 인식하지 않게 하기 위해서는 htmlspecialchars() 함수를 써주면 된다. htmlspecialchar()PHP 4, PHP 5, PHP 7, PHP 8 사용가능 어떤 문자들은 HTML에서 특별한 정의를 지니는데 그 의미를 보존하려면 HTML엔티티로 표현해야한다. 이 함수는 이러한 변환을 거친 문자열을 반환해준다. CharacterReplacement& (앰퍼샌드)&amp;" (쌍따옴표)&quot;' (따옴표)&#039 (부등호)&it;> (부등호)&gt;  사용예시[예시코드1]$entity= "내용내용";echo..

카페24 게시판 스킨 변경 시 링크 변수 변경

카페24 게시판 스킨을 새로 만드는 경우,게시판 각 항목 링크 클릭 시 기본으로 설정 되어있는 스킨(free, prouduct 등)으로 적용되어새로 만든 스킨으로 적용이 되지 않는다. 이 경우 아래와 같이 링크 부분을 변경해 주어야한다. [예시] 게시판 목록 (list.html파일)게시판 상세 페이지로 넘어가는 링크 경로를 변경해주어야한다. {$checkbox}{$no} {$icon_re}{$icon_lock}{$subject}{$icon_file}{$comment_count}{$icon_mobile}{$icon_new}{$icon_hit} {$category_name} ..

자바스크립트 예약어

예약어(Reserved Words)는 자바스크립트에 먼저 등록된 요소를 말한다. 이 예약어는 변수, 라벨, 펑션 네임으로 사용할 수 없다. 변수, 라벨 등에서 사용할 수 없는 예약어 arguments break case continue default do else false for function if null return super switch this true try typeof var void while with 예시 //사용가능 var apple = a; var name = a; //사용불가 var arguments = a; var if = a; var do = a; var default = a; 생각보다 많은 예약어가 있는데 아래 표 참고 참고 : https://www.w3schools.com/..

[jQuery] 새로고침 시 스크롤 위치 맨위로 리셋해주는 스크립트

스크롤을 내려 페이지를 보다가 새로고침 하는 경우, 브라우저가 이전 스크롤 위치를 기억하였다가 해당 스크롤 위치 그대로 보여준다. 새로고침 할 때, 이전 위치가 아닌 가장 위로 보여주고 싶은 경우 아래 코드를 넣어주면 된다. 문서 로드시, 자동으로 scrollTop: 0 을 적용하여, 문서 맨 위로 로드될 수 있도록 해준다. $(function(){ $("html, body").animate({ scrollTop: 0 }, "fast"); });

[jQuery] 스크롤 이벤트 / 스크롤 특정 위치에 따라 효과 변경

스크롤 위치에 따라 요소들에 Class를 추가해준다던지, 효과를 변경할 수 있다. 현재 스크롤 위치 구하기 $(document).scrollTop(); 특정 요소의 위치 구하기 offset().top을 사용하면 문서 상단으로부터 특정 섹션, div가 있는 위치를 구할 수 있다. $("#section3").offset().top; scroll()기본 코드 $(window).scroll(function(){ var h = $(document).scrollTop(); //현재 스크롤 위치 if(h > 200) { // 스크롤 위치가 200을 넘으면 } else { } }); 응용 현재 내 스크롤 위치와 특정요소의 위치를 통해 사이트에서 다양하게 구현이 가능하다. 1) 배경색이 검정색인 섹션(#section1)..

[php] Undefined variable, Undefined index 에러 해결

php 에서 Undefined variable, Undefined index 에러메세지는 값(변수)이 제대로 정의되지 않아 발생하는 오류이다. 값이 없는 경우를 대비해서 아래처럼 미리 지정을 해주어야한다. [에러 해결방법] isset()를 사용한 변수 선언 에러메세지가 Undefined variable : XX in /web/home/, Undefined index : XX in /web/home/ 이런식으로 뒤에 어떤 변수에 대한 오류인지 뜰텐데, 해당 변수를 isset()함수를 사용하여 값을 정해줘야한다. 해당 변수에 대한 값이 있으면 해당값을 보여주고 아니면 공백으로 값을 전달할 수 있도록 해야한다. $value = isset($_POST['value']) ? $_POST['value'] : '';..

[jQuery] Swiper 슬라이더 버튼 컬러 변경 (Navigation, Pagination)

Swiper 스와이퍼 슬라이더 기본 코드 https://swiperjs.com/ Swiper - The Most Modern Mobile Touch Slider Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com Slide 1 Slide 2 Slide 3 Slide 4 Slide 5 위와 같이 기본 CSS를 불러와 사용하면 아래처럼 모든 버튼들 컬러가 파란색으로 보여진다. Navigation, Pagination 컬러 변경 네비게이션, 페이지네이션의 파란색을 다른 색으로 변경하는 방법은 아주 간단하다. 아래와 같이 테마 컬러..

[php] 입력 필드 쪼개기 (체크박스 값 DB 저장)

체크박스 또는 여러개의 입력필드 내용을 한 필드안에 저장해서 사용해야하는 경우가 있다. 아래와 같이하면 필드 하나에 데이터를 저장해 관리할 수 있다. 글쓰기 페이지 코드 'wr_1'라는 필드를 쪼개서 사용할 것이다. 값을 받을 체크박스 name은 임의로 관리하기 편한 이름으로 지정하면 된다. (type1~type4) * wr_1 : 값을 저장할 필드 (type1~type4에서 받은 값을 wr_1에 한번에 저장한다) * type1~type4 : 임의로 값을 받을 필드 (DB에 해당 필드 없음) [코드 설명] - 상단의 $wr1 = explode("|", $write['wr_1']); 와 체크박스 태그 안의 checked 부분은 글쓰기 페이지를 수정 페이지로도 사용하는 경우에 필요하다. 해당 값이 있는 경우..