목록Javascript (9)

프로그램 개발서

그누보드5 이윰빌더 시즌4 CHEditor5에 에드온 이모티콘 삽입

Gnuboard5의 에디터로 들어가있는 cheditor5 에 대한 기록입니다.  이윰빌더 시즌4 에서 게시판 에드온 기능으로 이모티콘이 있습니다.  이윰빌더를 쓰려고할 때 이모티콘이 에디터에 추가되지 않는 것을 확인할 수 있을 것이다.그 이유는 에디터 내에 추가하는 함수에서 cheditor에 대한 처리가 없기 때문인데, 그러므로 수정을 해줘야만 이윰빌더 이모티콘을 에디터에 삽입할 수 있다. 기존 내용 추가 함수function set_textarea_contents(type,value) { var type_text = ''; var content = ''; switch(type) { case 'emoticon': type_text = '이모티콘'; break; ca..
Javascript 2024. 6. 24. 00:45
Javascript 함수 모음

1. onlyNumber(className) /** * 클래스 명 입력하여 지정가능 */ function onlyNumber(className = 'onlyNumber'){ className = '.' + classname; const onlyNumberEl = document.querySelectorAll(className); onlyNumberEl.forEach(function(el, idx){ el.addEventListener('keydown', function(keyboardEvent){ // 상단 숫자 0 ~ 9 if(keyboardEvent.which >= 48 && keyboardEvent.which = 96 && keyboardEvent.which
Javascript 2023. 8. 29. 14:46
카드번호 마스킹 처리 html, js 예제

2023.08.24 : 카드번호 위치 및 마스킹 표시 문자, 하이픈 표시여부, 하이픈 사용시 하이픈 위치 지정 설정 추가 2023.08.29 : 설정에 따라 다른 처리되는 것을 확인하기 위한 코드로 변경 카드번호 마스킹 처리 예제 코드 - html 카드번호 마스킹 번호 길이[최소, 최대] 마스킹 시작자리 마스킹 처리길이 실제 처리할 데이터 구분 마스크 처리 후 마스크 처리 전 하이픈(-) 사용여부 사용 사용안함 사용자가 입력하고 마스킹 처리되는 입력란 사용자가 입력한 번호 그대로 가지고 있는 입력란 실제로 백단으로 보낼 입력란 - javascript function onlyNumber(className = 'onlyNumber'){ className = "." + className; let onlyNum..
Javascript 2023. 7. 11. 17:52
pointer 이벤트를 통한 스크롤 처리

let sliderList = document.querySelectorAll('.pointer-scroll'); sliderList.forEach(function(item) { let x; let y; let flag = false; item.onpointerdown = function(event){ event.preventDefault(); x = event.clientX; y = event.clientY; flag = true; } item. onpointermove = function(event){ if(flag){ item.scrollLeft += (-1 * (event.clientX - x)); item.scrollTop += (-1 * (event.clientY - y)); x = event...
Javascript 2023. 6. 30. 16:55
가볍게 table 을 select 처럼 사용해보자.

플러그인을 사용하지 않고 jquery 로만 테이블을 select 처럼 선택해서 이용할 수 있도록 하는 스크립트 와 같은 형식으로 보여주고 진행한다. 1. table에서 라인 하나 클릭 시 이벤트가 동작할 수 있도록 스크립트 셀렉터 지정 2. 해당 라인을 클릭해서 선택했다는 표시가 될 수 있도록 클래스 정리 3. 해당 라인의 속성에 데이터 값으로 선택 값을 지정하고, 클릭하면 그 값을 가져오도록 지정 4. 폼 전송 시 데이터 전송이 가능하도록 테이블 속성에 인풋 명을 지정. 5. 인풋 명에 해당하는 인풋이 없으면 인풋을 만들고, 있으면 인풋에 값을 저장. $(document).on('click', '.select-table > tbody > tr', function(){ /* * * * * * * * * ..
Javascript 2021. 7. 28. 12:23
sprintf php to javascript

출처 : https://github.com/locutusjs/locutus/blob/master/src/php/strings/sprintf.js /** * @reference https://github.com/locutusjs/locutus/blob/master/src/php/strings/sprintf.js */ function sprintf() { // discuss at: https://locutus.io/php/sprintf/ // original by: Ash Searle (https://hexmen.com/blog/) // improved by: Michael White (https://getsprink.com) // improved by: Jack // improved by: Kevin va..
Javascript 2020. 11. 3. 14:28
[Javascript] Image Responsive Map Plugin

HTML 코딩에서 Image 특정 위치에 특별한 이벤트를 주려고 하는 경우 Map 태그를 많이 이용합니다. 다만 Map 의 경우 coord값으로 위치를 확인하는데 image에서의 좌표값이 고정이므로 반응형 홈페이지에서 이미지 크기가 유동적으로 변할 경우에 문제가 됩니다. 그렇다 보니 Image Map 좌표 값을 처리해주는 Plugin을 만들어 사용하게 되었는데, 많이 이용했던 플러그인으로는 jQuery-rwdImageMaps 가 있습니다. https://github.com/stowball/jQuery-rwdImageMaps 다만 이 플러그인은 약 4년전이 마지막으로 업데이트가 이루어진 플러그인이라 현 최신 브라우저에서는 작동하다가 정상적으로 작동하지 않는 경우가 발생하기도합니다. 아니면 동작하다가 어느날..
Javascript 2020. 9. 2. 15:16
SignUp.js v0.1

/** * @Version 0.1 * @Last 2020.05.20 * @Author rairen */ $(function () { 'use strict'; var is_submit = true; var id_check = false; $(document).on('blur', 'input[name="id"]', function () { var id_check_text = $('.id_check_text'); if (this.value.length >= 4) { var pattern1 = /[0-9]/; var pattern2 = /[a-z]/; var pattern_count = 0; if (pattern1.test(this.value)) { pattern_count++; } if (pattern2.te..
Javascript 2020. 5. 20. 11:05
이전 Prev 1 2 Next 다음