WEB/FRONT
-
[js] 현재 url parameter값 가져오기WEB/FRONT 2022. 6. 14. 11:17
네이버에 뭔가 썼을때 여기서 파라미터 .where 값을 가져오고싶을때 아래와 같이 사용할 수 있다. function URLParser(u){ var path="",query="",hash="",params; if(u.indexOf("#") > 0){ hash = u.substr(u.indexOf("#") + 1); u = u.substr(0 , u.indexOf("#")); } if(u.indexOf("?") > 0){ path = u.substr(0 , u.indexOf("?")); query = u.substr(u.indexOf("?") + 1); params= query.split('&'); }else path = u; return { getHost: function(){ var hostexp = ..
-
JQuery Validation Plugin 소개 및 활용!WEB/FRONT 2022. 5. 18. 16:00
JQuery Validation Plugin 앞서 포스팅 했던것 처럼 비슷하게 js로 유효성 검사를 구현할 수 있지만 미리 만들어져 있는걸 쓰고싶다면 jQuery Validation Plugin 이 있습니다. 상단 이미지와 같이 나오게 할 수 있으며 demo 페이지가 많으니 (https://jqueryvalidation.org/files/demo/milk/) 직접 경험할 수 있습니다. 사용 방법 1. 필요 코드 import https://jqueryvalidation.org/ 여기서 다운로드 합니다. jquery.validate.js 와 jquery 가 있어야합니다. (필수) 그리고 필자는 https://github.com/jquery-validation/jquery-validation/blob/bda9..
-
JS 날짜 형식 변환 유틸, 과거 날짜 구하기(YYYY-MM-DD,YYYY-MM-DD hh:mm, 일주일전 날짜 구하기)WEB/FRONT 2022. 5. 10. 15:17
/* yyyy-mm-dd */ function getDateStamp(){ var d = new Date(); //오늘날짜 var s = d.getFullYear()+'-'+ addzero(d.getMonth()+1)+'-'+ addzero(d.getDate()); return s; } /* 날짜 yyyy-mm-dd hh:mm 로 바꾸기 */ function getDateStampMinute(){ var d = new Date(); //오늘날짜 var s = d.getFullYear()+'-'+ addzero(d.getMonth()+1)+'-'+ addzero(d.getDate())+' '+ addzero(d.getHours())+':'+ addzero(d.getMinutes()); return s; }..
-
[js] 자바스크립트 파일 업로드 확장자 제한 2가지 방법 (feat, 파일다운방법)WEB/FRONT 2021. 11. 4. 18:08
안녕하세요 오늘은 자바스크립트에서 파일을 업로드할때 확장자를 제한하는 방법에 대하여 포스팅합니다. 두가지 모두 사용하는게 좋을듯 합니다. 1. 태그에 accept 사용하기 일차원적으로 input태그에 accept을 사용하면 ^이렇게 형식이 Microsoft Excel Worksheet로 제한됩니다. 그런데 여기서 누군가가 하필이면 모든 파일을 선택하고 파일을 업로드할 가능성이 있기때문에 두번째 작업도 해줍니다. 2. 자바스크립트 사용하기 순서 : 파일 업로드를 클릭 > 업로드한 파일 확장자 검사 > 디비에 업로드 // 파일 업로드시 업로드된 파일들 정보 가져옴 //document.excelForm으로 되어있는데 여기서 excelForm은 태그의 name 값입니다. var fm = document.exce..
-
[JSTL] JSTL 셋팅하는법 (pom.xml, spring, eclipse, maven)WEB/FRONT 2021. 10. 4. 13:27
웹개발을 하면서 jsp를 사용한다면 쓰게되는 jstl! 간단히 셋팅하는 방법을 포스팅하겠습니다! 1. pom.xml 에 라이브러리 추가 javax.servlet jstl 1.2 taglibs standard 1.1.2 2. jsp 상단에 하단 내용 추가 3. 예시 사용자 목록 총 사용자 : ${userCount } 명 감사합니다. 도움이 되었길 바라며 이만... 관련 포스팅 2021.05.10 - [WEB/FRONT] - [JSTL] select 태그 반복문, option selected 주기, if, forEach, radio 태그에서 checked하기
-
<form> 데이터를 서버로 제출하고 응답결과를 <iframe>에서 보여주기WEB/FRONT 2021. 6. 30. 17:14
태그의 target 속성을 알아야한다. _blank 서버로부터 받은 응답을 새로운 윈도우나 탭(tab)에서 보여줌. _self 기본값으로 생략 가능. _parent 서버로부터 받은 응답을 현재 프레임의 부모 프레임에서 보여줌. _top 서버로부터 받은 응답을 현재 윈도우 전체에서 보여줌. 프레임 이름 서버로부터 받은 응답을 명시된 프레임에서 보여줌. 로직 1. 생성 ↓ 2. 생성 - target을 iframe의 name값과 똑같이 설정하여 form 의 결과값이 iframe 에서 보여지게 만든다. 이때 추가로 보내고싶은 데이타를 으로 연결하여 보낸다. ↓ 3. 보내기 태그의 action주소로 보낸다. //iframe 생성 function createIframe(){ var aIframe = document..
-
[js]getElementByClassName,getElementsByTagName,querySelectorAll, classList, dataset,classList.contains, appendChild등등 DOM 조작 총 정리WEB/FRONT 2021. 5. 18. 15:46
안녕하세요 오늘은 html에 필요한 값을 js로 조작할때 쓰이는 용법들에 대해 총정리 하는 시간을 보내도록 하겠습니다. (즐겨찾기 추가해두고 필요할때마다 보면 어느덧 익혀진 나자신 발견) id, class로 원하는 값 가져오기 getElementById, getelementsByClassName, getElementsByTagName // getElementById var element = document.getElementById('tag-id'); // returns a single element element.getElementsByTagName('div'); // getElementsByClassName var elements = document.getElementsByClassName('clas..
-
[js] input 값 enter로 넘기기, 엔터WEB/FRONT 2021. 5. 13. 10:37
클릭이 아니라 enter키를 활용하여 submit하는 방법에 대해 알아보겠습니다. $(document).off("keypress"); $(document).on("keypress",function (event) { if(event.keyCode === 13 ) { $("#Btn").click(); } }); 엔터키의 코드는 13이라서 13을 press했을시 원하는 버튼 ( 여기서는 아이디가 Btn인것)을 click() 효과 넣어주게되면 동일한 이벤트가 발생하게됩니다.