본문 바로가기

javascript/jQuery

(13)
jquery prop 사용할 때 selectbox의 첫번째 option을 선택하고자 한다. prop 메소드를 사용하고자 할 때. ( option 을 선택하면 chage가 실행된다.) 1번 $('#selectList option:first').prop("selected", true).trigger("change"); 2번 $("#selectList").prop("selectedIndex", 0).trigger("change"); 2가지 방법이 있을 때, 1번보다 2번이 명확하게 잘 실행이 됐다. prop에 대한 공식 : https://api.jquery.com/prop/ .prop() | jQuery API Documentation Description: Get the value of a property for the first elem..
제이쿼리 데이트피커 사용법 활용 제이쿼리 데이트피커 사용법 활용 let date = $("#from36").val().split("."); date[1] = date[1] - 1; let formattedDate = new Date(date[0], date[1], date[2]).toLocaleDateString("ko-KR", {year: "numeric", month: "2-digit", day: "2-digit"}); $("#to36").val(formattedDate); $("#to36").datepicker({ setDate:"0", dateFormat:"yy-mm-dd", }); 옵션 참고 : https://www.nextree.co.kr/p9887/ jQuery: 참 편리한 날짜선택 위젯- datepicker 웹 페이지를 ..
Chart.js bar chart 막대차트 2개일 때 간격 조정하는 옵션 Chart.js bar chart 막대차트 2개일 때 간격 조정하는 옵션 chart.options.categoryPercentage = 0.5; chart.options.barPercentage = 1.0; HTML 삽입 미리보기할 수 없는 소스 참고 : Chart.js 한글문서! 감사합니다! https://yeon22.github.io/Chartjs-kr/ Chart.js | 당신의 웹사이트를 위한 HTML5 차트 오픈소스 2.0의 새로운 기능 모든 것에 애니메이션을! 데이터 변경, 색상 수정과 데이터 집합을 추가할 때 탁월한 애니메이션 효과를 제공합니다 yeon22.github.io 한글 문서 작성하신 분 : 감사합니다~! https://medium.com/@su_bak/side-project-cha..
jquery toggle 탭 버튼 만들기 제이쿼리 토글 탭 버튼 만들기. 아주 다양한 방식이 존재하지만... 오늘은 이렇게 만들어 봤다! $('.btn > div').click(function(){ const classNameIs = $(this).attr('class'); // 클래스 이름으로 패널 const panelSelector = '.panel' + classNameIs.charAt(0).toUpperCase() + classNameIs.slice(1); // 선택한 패널의 토글, 형제요소 숨기기 $(panelSelector).toggle(0, function(){ $(this).siblings().css("display","none"); }); }); HTML 마크업된 부분의 이름을 가져와서 만들어주는게 포인트다. 결과 : HTML ..
제이쿼리 $(this) $('this') 어? 왜 안되지? $('this') 이렇게 써서 안되었던 것임.. 오랜만에 제이쿼리를 썼다고하기에는.... 어처구니 없는 실수였다. 따옴표 빼야함!! 나같은 사람이 있나 싶어서 검색해봄. 참고 : https://stackoverflow.com/questions/12712030/this-vs-this-in-jquery $(this) vs $('this') in jquery What's the difference between $(this) vs $('this') in jquery ? stackoverflow.com
jquery 제이쿼리 메뉴 active 클래스 추가하여 활성화 클래스 적용 방법 pathname을 받아와서 일치하는 a태그에 클래스를 넣어주어서 페이지가 이동 될 때마다, 해당하는 페이지에 메뉴가 활성화 상태로 보이게 하는 것이 목적. pathname은 http://localhost:8030/ 다음으로 나오는 "프로젝트명과 페이지 이름"까지. 지금 프로젝트 기준으로는 " /ableProject/statistic " 이부분. 프로젝트명은 ableProject 이고 pathname에서 프로젝트명을 지워주면 statistic 페이지 이름만 남으니까, 이 부분을 a태그의 href와 일치 시켜주는 a 태그를 찾기로 함. HTML Index Monitoring 미세먼지 Board JS & jQuery const pathname = (location.pathname).split('/'); // ..
jQuery set CSS background opacity jQuery css background opacity https://stackoverflow.com/questions/19663427/jquery-set-css-background-opacity jQuery set CSS background opacity I have a whose transparency of its background-color (and not its contents) I'd like to change. A remote API sends me this colour: #abcdef and I tell jQuery (1.9) to apply this colour ... stackoverflow.com 3가지 방법 정리한 것 https://codepen.io/keepgoing-noah/pen..
jQuery after if문 if(type == '2') { let selectOption = ''; selectOption += ''; selectOption +=`옵션 선택1`; selectOption +=`옵션 선택2`; selectOption +=`옵션 선택3`; selectOption +=''; $("#selectType60").after(selectOption); } else { } if(type == '2'){ $('#unxp_knd').css({'display':'inline-block'}); } else { $('#unxp_knd').css({'display':'none'}); } switch(type){ case "강아지" : return console.log("강아지"); case "고양이" : return co..