Learning/Javascript

테이블 목록 번호 재정렬하기

$(".del").click(function () { //삭제 버튼 클릭시 var cnt = 0; $(this).parent().parent().remove(); //해당 row 삭제 $("#tblBody").find("tr").each(function () { ++cnt; $(this).find(".Num").text(cnt); }); }); @item["RowNum"]

특정 시간대에 동작하는 Alert창 만들기

특정 시간대에 Alert창을 띄우는 스크립트

이미지 클릭시 크게보이는 모달창 구현

$(function(){ $("canvas").ondblclick(function(){ let img = new Image(); img.style.objectFit = 'cover'; img.style.maxWidth = '1200px'; img.style.maxHeight = '1200px'; img.src = $(this).attr("src") $('.modalBox').html(img); $(".modal").show(); }); $(".modal").click(function (e) { $(".modal").toggle(); }); });

웹페이지 카카오톡으로 공유하기

웹페이지에서 공유하기 버튼을 누르면 이렇게 카카오톡으로 공유하는 기능이다. 총 개발시간 10~15분이면 완성할 만큼 간단하다. https://developers.kakao.com/ Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 여기서 애플리케이션 새로 생성. 자바스크립트 키를 복사해둔다. 왼쪽 플랫폼 탭에서 도메인 설정 메시지탭 - 메시지 템플릿 빌더 작성해줌. 아래 그림 참고. jsp나 템플릿에서 자바스크립트 코드 작성 if (!Kakao.isInitialized()) { Kakao.init('Javascript Key'); } functio..

폼 데이터 출력

var form = $('#fileUploadForm')[0]; var data = new FormData(form); for (let key of data.keys()) { console.log(key, ":", data.get(key)); }