차근차근/JAVA Script 110

동적 셀렉트 박스 추가 삭제

https://nahosung.tistory.com/28 div 동적 생성 (appendChild) 자바스크립트 appendChild를 사용하여 div를 동적으로 추가해주는 자바스크립트입니다. 아래와 같은 html이 있으면, 추가버튼을 클릭하면 room_type이란 id를 가진 div를 복사하여 field란 id를 가진 div에 생성해주는 nahosung.tistory.com //appendChild를 사용하여 div를 동적으로 추가해주는 자바스크립트입니다. //아래와 같은 html이 있으면, //추가버튼을 클릭하면 room_type이란 id를 가진 div를 복사하여 //field란 id를 가진 div에 생성해주는 소스입니다. //삭제를 눌렀을경우에는 삭제해주는 소스입니다. 제목 //출처: https:/..

input type file.. 여러 건 업로드

[현재 상황] input type file 일 때 멀티파트 써서.. 파일 여러개 등록 가능함. 폼 서브밋으로 글 등록시 폼 전체 넘김. [구현하고 싶은 것] 첨부파일 버튼을 눌렀을 때 '폴더1' 에서 몇 개의 파일을 선택해도 등록이 되지만.. (서브밋 전) '폴더2'의 파일도 추가하려고 첨부파일 버튼을 누르면 이전에 폴더1에서 추가해뒀던 파일은 사라지고 폴더2에서 새로 선택한 파일만 남음.......................................................................... 그래서.. 첨부파일 버튼을 몇번을 누르던지.. 계속 파일을 누적해두고 싶다. 누적하는 방법 찾아보고 안되면 ajax로 하나씩 등록해버려야 할듯? [해결] 1. js에서 배열을 만들고 배열에..

붙여넣기 이벤트 감지 후 클립보드 내용 변경하기 - 안됨

네이버 에디터를 사용중인데 에디터에 스크립트를 붙여넣기 하는 경우..텍스트를 변경하려고 한다. 일단 네이버 에디터만드는 부분 일부 var oEditors = []; // 추가 글꼴 목록 //var aAdditionalFontSet = [["MS UI Gothic", "MS UI Gothic"], ["Comic Sans MS", "Comic Sans MS"],["TEST","TEST"]]; nhn.husky.EZCreator.createInIFrame({ oAppRef: oEditors, elPlaceHolder: "ir1", sSkinURI: "SmartEditor2Skin.html", htParams : { bUseToolbar : true,// 툴바 사용 여부 (true:사용/ false:사용하지 않..

이미지 첨부파일 다운로드 시 유효성 체크하기

//url : 다운로드 할 이미지 전체 //ex) chrome://new-tab-page/icons/google_logo.svg //filename : 사용자가 파일을 내려받았을 때 보여지는 파일명 function fn_isValidHttpsURL(url , filename){ // url.match : url형식에 맞는지 확인 var res = url.match(/(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g); //url형식이 맞다면~ if(res !== null){ $.ajax({ type:"get" ,url : url ,success : function(respons..

viewport remove

특정 조건에 따라 뷰포트를 추가하거나 빼야할 일이 생겼다. document.getElementsByName('viewport')[0].remove(); document.getElemnetById("form").style.display="none"; * ~viewport~.style.display="none"; 도 해봤는데 화면에 style="display:none" 까지 붙어서 나오더라. * 내가 해당 jsp에서 viewport를 주석처리 해두고 getElements어쩌고를 해서 null이 나오기도 했음. * 코드는 다 맞는데 작동을 안하면 해당 스크립트를 jsp하단으로 빼보길 [ meta태그값 컨트롤 ] https://stackoverflow.com/questions/2568760/is-it-possi..

sort()

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/sort Array.prototype.sort() - JavaScript | MDN sort() 메서드는 배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환합니다. 정렬은 stable sort가 아닐 수 있습니다. 기본 정렬 순서는 문자열의 유니코드 코드 포인트를 따릅니다. developer.mozilla.org https://hianna.tistory.com/409 [Javascript] 배열 정렬하기 (오름차순, 내림차순, 문자열, 객체) 배열 정렬하기 (오름차순, 내림차순, 문자열, 객체) 1. sort() 함수 2. sort() 함수로 숫자 오름..

chart.js 그래프 겹침/ 흔들림

[상황] 샘플 화면이라 내 상황과는 다르지만 나의 경우 '바'모양의 그래프가 있고 바를 눌렀을 경우 그 라벨을 가지고 함수를 타서 '라인' 그래프를 그린다. 그래프1 - 바 그래프2 - 라인 (바의 특정 데이터의 상세 정보를 그래프로 그림) * https://www.chartjs.org/docs/2.8.0/ Chart.js · Chart.js documentation No results matching "" www.chartjs.org chartjs 2.8버전을 사용했고 https://www.chartjs.org/docs/2.8.0/general/interactions/events.html 여기보면 이벤트를 사용할 수 있는 방법이 있는데 나는 var chart = new Chart(ctx, { type:..

body onload / window onload()

일반적으로, 스크립트를 문서의 마지막() 이전에 삽입하면 굳이 이벤트를 이용해 프로그래밍을 처리할 필요가 없다. 다만, 문서의 DOMContentLoaded HTML과 script가 로드된 시점에 발생하는 이벤트 - onload이벤트보다 먼저 발생한다. 빠른 실행속도가 필요할 때 적합 - IE8이하에서는 지원하지 않는다.(대체방법) 더보기 https://stackoverflow.com/questions/1795089/how-can-i-detect-dom-ready-and-add-a-class-without-jquery/1795167#1795167 How can I detect DOM ready and add a class without jQuery? I want to rewrite this line wi..

location.href 와 location.replace 차이점

location.href location.replace 기능 새로운 페이지로 이동된다. 기존페이지를 새로운 페이지로 변경시킨다. => 현재 페이지를 새로운 페이지로 덮어 씌우기 때문에 이전 페이지로 이동이 불가능하다 형태 속성 메서드 주소 히스토리 기록된다 기록되지 않는다. 사용예 location.href='abc.php' location.replace('abc.php') 객체의 속성 메서드(함수) * href 일반적인 페이지 이동 replace는 이전페이지로 접근이 필요없는 경우에 보안상 덮어씌우기 [참조] https://blog.naver.com/yiuse78/50100213667 [자바스크립트] location.href 와 location.replace 의 차이점. 자바스크립트에서 페이지 이동 시킬..

반응형