2024년 2월 21일 수요일

javascript - SQL 예약어 제거

 
<script language="javascript">

//특수문자, 특정문자열(sql예약어) 제거
function checkSearchedWord(obj){
obj.value = obj.value+" ";
//특수문자 제거
if(obj.value.length >0){
var expText = /[%=><]/ ;
if(expText.test(obj.value) == true){
obj.value = obj.value.split(expText).join(""); 
}
//체크 문자열
var sqlArray = new Array( //sql 예약어
"OR", "SELECT", "INSERT", "DELETE", "UPDATE", "CREATE", "DROP", "EXEC", "UNION",  "FETCH", "DECLARE", "TRUNCATE"
);
var regex;
var regex_plus ;
for(var i=0; i<sqlArray.length; i++){
regex = new RegExp("\\s" + sqlArray[i] + "\\s","gi") ;
if (regex.test(obj.value)) {
obj.value =obj.value.replace(regex, "");
alert("\"" + sqlArray[i]+"\"와(과) 같은 특정문자로 검색할 수 없습니다.");
}
regex_plus = new RegExp( "\\+" + sqlArray[i] + "\\+","gi") ;
if (regex_plus.test(obj.value)) {
obj.value =obj.value.replace(regex_plus, "");
alert("\"" + sqlArray[i]+"\"와(과) 같은 특정문자로 검색할 수 없습니다.");
}
}
}
return obj.value = obj.value;
}

function searchUrlJuso(){
$("#resultData").hide();
var frm = document.AKCFrm;
frm.keyword.value = checkSearchedWord(frm.keyword); // 특수문자 및 sql예약어 제거, 20160912
$("#keyword").val(validateJuso($("#keyword").val())); //공백 및 특수문자 제거
if(!checkValidate1(frm.keyword, "검색어")) return;
else if(!checkValidate2(frm.keyword.value)) return;
$("#keyword").val(regExpCheckJuso($("#keyword").val()));
//우선정렬
if($("input:radio[name=raFirstSort]:checked").val() != undefined){
var firstSort = $("input:radio[name=raFirstSort]:checked").val();
$('#firstSort').val(firstSort);
}else{
$('#firstSort').val("none");
}
if( "Y" == "null" ){
$.ajax({
/* url :"https://www.juso.go.kr/addrlink/addrLinkApiJsonp.do"  //인터넷망 */
url :"https://business.juso.go.kr/addrlink/addrLinkApiJsonp.do"  //인터넷망
,type:"post"
,data:$("#AKCFrm").serialize()
,dataType:"jsonp"
,crossDomain:true
,success:function(xmlStr){
if(navigator.appName.indexOf("Microsoft") > -1){
var xmlData = new ActiveXObject("Microsoft.XMLDOM");
xmlData.loadXML(xmlStr.returnXml)
}else{
var xmlData = xmlStr.returnXml;
}
$(".popSearchNoResult").html("");
var errCode = $(xmlData).find("errorCode").text();
var errDesc = $(xmlData).find("errorMessage").text();
var totalCount = $(xmlData).find("totalCount").text();
var currentPage = $(xmlData).find("currentPage").text();
if( parseInt(totalCount) > 1000 && currentPage == "1" )
alert("검색 결과가 너무 많습니다(1,000건 이상)\n검색어 예를 참조하여 검색하시기 바랍니다.");
if(errCode != "0"){
alert(errDesc);
}else{
if(xmlStr != null){
makeList(xmlData);
}
}
}
    ,error: function(xhr,status, error){
    //alert("에러발생");
    alert("검색에 실패하였습니다 \n 다시 검색하시기 바랍니다.");
    }
});
}else{
$("#AKCFrm").attr("action","/addrlink/addrLinkUrlSearch.do").submit();
}
}

2024년 1월 15일 월요일

프로젝트 진행 및 관리 항목

 

[전체]

01. 프로젝트 일정 (전체)

02. 요구사항 정리 (사업부 + 고객부 -> 기획)

03. 기능 정의서 (기획)

04. 요구사항 분석 및 기획 컨셉 (기획)

05. 화면 UI (기획)

06. 디자인 컨셉 및 벤치마킨 (디자인)

07. 디자인 주요화면 (디자인)

08. 설계분석 (기획, 개발)

09. 개발환경 및 공용 콘트롤 (개발)

10. DB설계 (개발)

11. 개발 산출물 (개발)

12. 컨텐츠 작성 및 등록 (전체)

13. QC (전체)

14. 기타 (업무 및 개발 툴 등)



[주요항목]

01. 프로젝트 관리 및 일정 (전체)

02. 요구사항 정리 (담당자 및 기획)

03. 화면 UI (기획)

04. 디자인 주요화면 (디자인)

05. DB 설계 (개발)

06. 컨텐츠 (전체)

07. QC (전체)



[자료]

* 예상 리스트 정리

* 프로젝트 리소스 산정

* 프로젝트 전체 세부 일정

* 리소스별 투여 기간(일정)

* 메뉴(기능)별 리소스 일정



2024년 1월 3일 수요일

javascript - input 태그 event

 

<input/> 이벤트 발생 순서

focus => keyDown => keyPress => input => keyUp => blur => change
( * keyDown 사용 권장)



<input/> 관련 이벤트들

focus : 요소가 포커스가 되고 커서가 발생하여 입력이 가능해졌을 때 발생하는 이벤트입니다. 이후 진행되는 인풋 관련 이벤트들이 발생하고 감지될 수 있는 시작점이 됩니다.

blur : 요소의 포커스가 해제되었을 때 발생하는 이벤트입니다.

change : focus가 발생하기 전의 원래 입력값과 비교하여 변화가 일어났을 경우 blur 이벤트 이후에 발생하는 이벤트입니다.

input : value 속성의 값이 바뀔 때마다 발생하는 이벤트입니다. 일반적으로 keyPress 직후에 value 속성이 바뀌면서 input 이벤트가 발생합니다. input 이벤트 객체의 data 프로퍼티는 value 속성에 가장 최근 추가된 한 글자를 가지고 있습니다.(영어의 경우 알파벳 한 글자, 한국어의 경우 초성/중성/종성으로 이루어진 한 글자)

keyDown : 키가 눌렸을 때 발생합니다. input 이벤트 전에 발생됩니다.

keyPress : 키가 눌렸을 때 발생하며, keyDown 이벤트 이후에 발생합니다. 한글 입력이나 기능키 입력시에는 발생하지 않습니다. MDN에서 찾아보면 deprecated 되었다고 나오니, input 이벤트 전에 입력을 제어하고 싶다면 keyDown 이벤트를 사용하는게 바람직해 보입니다.
keyDown과 여러모로 비슷한 특성을 가지지만 특정 키에는 발생하지 않는 등의 예기치 않은 동작으로 혼란을 줄 수 있는 이벤트가 아닐까 생각합니다.

keyUp : input 이벤트 발생 후 value가 업데이트 된 이후에 키보드에서 손을 떼면 발생하는 이벤트입니다. 당연하게도 키를 꾹 눌러서 입력을 반복하거나 할때는 발생하지 않습니다.


출처 : https://maxkim-j.github.io/posts/keyboard-input/



Html - 점검중 페이지 (예문)



<!DOCTYPE html>
<html lang="ko">
<head>
    <title>사이트 점검중</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="Content-Script-Type" content="text/javascript" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="imagetoolbar" content="no" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/js/all.min.js"></script>
</head>
<body style="font-family: 'MS Gothic';">
    <div style="position:absolute;left:50%;top:50%;transform: translate(-50%, -50%);width: 587px;height: 488px;outline: solid 1px #D4D4D4;">
        <div style="width:100%;height:62px;vertical-align: middle;display: flex;">
            <div style="width:80%;margin-left:3%;float:left;font-size:30px;font-weight:600;margin-top: 10px;"><i class="fa-solid fa-circle-exclamation fa-bounce" style="color: #fe3f40;margin-right:5px;"></i>사이트 임시점검 안내</div>
            <div style="width:20%;margin-right:3%;float:left;font-size:18px;margin-top:20px;">미소몰닷컴</div>
        </div>
        <div style="width:94%;height:1px;margin-left:3%;border-bottom:1px dotted #D4D4D4;"></div>
        <div style="height:100px;margin-top:50px;width:94%;margin-left:3%;">
            <span style="justify-content:center;align-items:center;display:flex;">사이트입니다.</span>
            <span style="justify-content:center;align-items:center;display:flex;">보다 나은 서버스 제공을 위하여 홈페이지 이용이 제한됩니다.</span>
            <span style="justify-content:center;align-items:center;display:flex;">빠른 시간내에 정상 서비스가 가능하도록 노력하겠습니다.</span>
        </div>
        <div style="height:100px;width:94%;margin-left:3%;background-color:#F1F1F1;border-radius: 10px;">
            <span style="justify-content:center;align-items:center;display:flex;padding-top:25px;">
                일자 : 2023년 12월 28일 목요일<br />
                시간 : 18시 00분 ~ 20시 00분
            </span>
        </div>
        <div style="margin-top:50px;">
            <span style="font-size:20px;font-weight:bold;justify-content:center;align-items:center;display:flex;">양해부탁드립니다.</span>
            <span style="font-size:20px;font-weight:bold;justify-content:center;align-items:center;display:flex;">감사합니다.</span>
        </div>
    </div>
</body>
</html>
 

javascript - Notice rolling

 
        function rollingNotice() {
        var $element = $('#noticeList');
        var speed = 3000;
        var timer = setInterval(moveNextSlide, speed);
        var move = $element.children().outerHeight();
        var lastChild;
        lastChild = $element.children().eq(-1).clone(true);
        lastChild.prependTo($element);
        $element.children().eq(-1).remove();
        if($element.children().length==1) {
        $element.css('top','0px');
            }
            else {
        $element.css('top','-'+move+'px');
        }
        $element.find('>a').bind({
        'mouseenter': function(){
        clearInterval(timer);
        },
        'mouseleave': function(){
        timer = setInterval(moveNextSlide, speed);
        }
        });
        function moveNextSlide() {
        $element.each(function(idx){
        var firstChild = $element.children().filter(':first-child').clone(true);
        firstChild.appendTo($element);
        $element.children().filter(':first-child').remove();
        $element.css('top','0px');
        $element.animate({'top':'-'+move+'px'},'normal');
        });
        }
        }


                    <dl class="notice" style="position:relative;overflow:hidden;">
                        <dt><a href="" title="공지사항 바로가기" rel="nosublink">[공지사항]</a></dt>
                        <dd id="noticeList">
                                    <a href="" class="hiddenOverflow" style="display:block;width:200px;height:27px" rel="nosublink">item.TITLE</a>
                        </dd>
                    </dl>


dl.notice {float:left;padding-top:9px;width:325px;height:23px}
dl.notice dt {float:left;padding-right:6px;font-weight:bold;color:#ff4948}
dl.notice dt a {color:#ff4948;vertical-align:top}
dl.notice dd {float:left;padding-right:7px;font-size:12px}
dl.notice dd a {color:#444;vertical-align:top}


javascript - getUrlParams (object params)

 

    function getUrlParams() {
        var params = {};
        window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(str, key, value) { params[key] = value; });
        return params;
    }


        try {
            var oParams = getUrlParams();
            if (oParams.Gubun) {
                //changeViewGubun('C');
            }
            if (oParams.Name) {
                //$("#txtName").val(decodeURI(oParams.Name));
            }
        }
        catch (e) {
        }


jQuery - Datepicker

 
<script>
   $(function() {
       //input을 datepicker로 선언
       $("#datepicker").datepicker({
           dateFormat: 'yy-mm-dd' //달력 날짜 형태
           ,showOtherMonths: true //빈 공간에 현재월의 앞뒤월의 날짜를 표시
           ,showMonthAfterYear:true // 월- 년 순서가아닌 년도 - 월 순서
           ,changeYear: true //option값 년 선택 가능
           ,changeMonth: true //option값  월 선택 가능                
           ,showOn: "both" //button:버튼을 표시하고,버튼을 눌러야만 달력 표시 ^ both:버튼을 표시하고,버튼을 누르거나 input을 클릭하면 달력 표시  
           ,buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif" //버튼 이미지 경로
           ,buttonImageOnly: true //버튼 이미지만 깔끔하게 보이게함
           ,buttonText: "선택" //버튼 호버 텍스트              
           ,yearSuffix: "년" //달력의 년도 부분 뒤 텍스트
           ,monthNamesShort: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'] //달력의 월 부분 텍스트
           ,monthNames: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'] //달력의 월 부분 Tooltip
           ,dayNamesMin: ['일','월','화','수','목','금','토'] //달력의 요일 텍스트
           ,dayNames: ['일요일','월요일','화요일','수요일','목요일','금요일','토요일'] //달력의 요일 Tooltip
           ,minDate: "-5Y" //최소 선택일자(-1D:하루전, -1M:한달전, -1Y:일년전)
           ,maxDate: "+5y" //최대 선택일자(+1D:하루후, -1M:한달후, -1Y:일년후)  
       });                    
       
       //초기값을 오늘 날짜로 설정해줘야 합니다.
       $('#datepicker').datepicker('setDate', 'today'); //(-1D:하루전, -1M:한달전, -1Y:일년전), (+1D:하루후, -1M:한달후, -1Y:일년후)            
   });
</script>





function setDatePicker() {
    $.datepicker.regional['ko'] = {
        changeMonth: true,
        changeYear: true,
        closeText: '닫기',
        prevText: '이전달',
        nextText: '다음달',
        currentText: '오늘',
        monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
        monthNamesShort: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
        dayNames: ['일', '월', '화', '수', '목', '금', '토'],
        dayNamesShort: ['일', '월', '화', '수', '목', '금', '토'],
        dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],
        weekHeader: 'Wk',
        dateFormat: 'yy-mm-dd',
        firstDay: 0,
        isRTL: false,
        duration: 200,
        showAnim: 'show',
        showMonthAfterYear: true,
        inline: true,
        showOn: 'both',
        buttonImage: "/images/wos/btn_calendar.gif",
        buttonImageOnly: true
    };

    $.datepicker.setDefaults($.datepicker.regional['ko']);
};


    $(document).on("ready", function () {
        setDatePicker();
        $('#txtStartDate, #txtEndDate').datepicker().datepicker('setDate', new Date());
    });





javascript - SQL 예약어 제거

  <script language="javascript"> //특수문자, 특정문자열(sql예약어) 제거 function checkSearchedWord(obj){ obj.value = obj.value+&quo...