'컴퓨터/JavaScript (jQuery)'에 해당되는 글 15건

  1. 2018.04.27 정규식 패턴 종류
  2. 2018.04.24 사업자 등록번호 체크방법
  3. 2018.02.07 Modal로 팝업 띄우기 6
  4. 2018.01.05 엔터 칠때 자동으로 클릭하기
  5. 2015.10.22 jQuery 동적 이벤트 on
2018. 4. 27. 17:57


기타 정규식방법


1. 숫자형만 

_regexp = /[0-9]/gi;


2. 자릿수 제한(숫자형 3자리까지만 입력)

_regexp = /^[0-9].{0,2}$/;


3.날짜입력

_regexp = /[0-9\-.]/gi;

(날짜 숫자, 대쉬(-), 점(.) 만 입력가능하게)


4. 영문과 숫자만 입력가능

_regexp = /[A-Za-z0-9]/gi;


5. 이메일 형식

 _regexp = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i;


6. 숫자나 특수문자 포함 10-15자리 영문 대소문자만 가능(암호같은거)

_regexp = /^(?=.*[a-zA-Z])((?=.*\d)|(?=.*\W)).{10,15}$/;


7. 한국, 영문 숫자

_regexp = /^[ㄱ-ㅎ|가-힣|a-z|A-Z|0-9]+$/;


8. 숫자와 "-" 만. (핸드폰번호)

_regexp = /[0-9\-]/gi;


9. 아이피

_regexp = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;


10. 재생시간(00:03:23)

 _regexp = /([0-9][0-9])\:([0-5][0-9])\:([0-5][0-9])/;


재생시간 00:03:12  이렇게 입력할때, 분, 초는 60초 넘으면 안되서, 계산하는 로직 짜는것도 좋지만, 


그냥 위에 처럼 , 쓰면 편하다.


 _regexp = /([0-9][0-9])\:([0-5][0-9])\:([0-5][0-9])/;

                 숫자(0-9)숫자(0-9)  :   숫자(0-5)숫자(0-9)  :   숫자(0-5)숫자(0-9)


분, 초위치에서 첫째자리 숫자는 0-5까지의 숫자만 쓸수있게 하는거다


첫째자리 숫자가 5 이상일리가 없으니까....



Posted by Tyson
2018. 4. 24. 17:29


사업자 등록번호 체크할 일이 있어서, 


밑에 페이지에서 가져와서 해놓았는데, 


체크썸이 0으로 끝났을때는 안되서, 보니까, 10일수도 있어서 한번 더 해줘야 되더라..


퍼온 페이지

https://gs.saro.me/#!m=elec&jn=10




사업자 등록번호는 123-45-67890 의 10 자리 구조입니다.
123 : 국세청 / 세무서별 코드
45 : 개인 법인 구분코드
6789 : 과세/면세/법인 사업자 등록/지정일자 일련번호
0 : 검증번호

검증방법
예제번호 : 123-45-67891
1. 하이픈 제거
1234567891 [사업자 10자리]
2. 인증키 배열 - 고정된값이다.
137137135 [인증키 9자리]
3. 사업자 앞 9자리와 인증키 앞 9자리를 각각 곱하여 모두 더합니다.
123456789 [사업자 앞9자리]
137137135 [인증키 9자리]
합계 = (1 * 2) + (2 * 3) + (3 * 7)..... + (9 * 5) = 165
합계 = 165
4. 앞 9자리의 마지막 값을 다시 곱하고 10으로 나눕니다.
((9 * 5) / 10) = 4.5 소수점제거 = 4
5. 합계에 바로위 값을 더해준다.
합계 = (합계165) + 4
합계 = 169
6. 합계를 10으로 나누어 나머지를 구합니다.
(169) % 10 = 9
값 = 9
7. 10 - 값을한다.
10 - 값(9) = 1
8. 마지막 자리수가 1이면 사업자등록번호입니다.
그럼으로 예제는 사업자 등록번호입니다.

  1. // 국내에 종속성을 가지고있기에 라온에는 직접 들어가지 않겠지만 나중에 확장용으로 들어갈 수 있습니다. (은글슬쩍 라이브러리 광고....)
  2. // https://dev.saro.me/raon/
  3. // 사업자번호 체크
  4. // 2015-04-24 전명 박용서 작성
  5. function ckBisNo(bisNo)
  6. {
  7. // 넘어온 값의 정수만 추츨하여 문자열의 배열로 만들고 10자리 숫자인지 확인합니다.
  8. if ((bisNo = (bisNo+'').match(/\d{1}/g)).length != 10) { return false; }
  9. // 합 / 체크키
  10. var sum = 0, key = [1, 3, 7, 1, 3, 7, 1, 3, 5];
  11. // 0 ~ 8 까지 9개의 숫자를 체크키와 곱하여 합에더합니다.
  12. for (var i = 0 ; i < 9 ; i++) { sum += (key[i] * Number(bisNo[i])); }
  13. // 각 8번배열의 값을 곱한 후 10으로 나누고 내림하여 기존 합에 더합니다.
  14. // 다시 10의 나머지를 구한후 그 값을 10에서 빼면 이것이 검증번호 이며 기존 검증번호와 비교하면됩니다.
  15. return (10 - ((sum + Math.floor(key[8] * Number(bisNo[8]) / 10)) % 10)) == Number(bisNo[9]);
  16. }

=============================================================================


여기 같에 보면 마지막에 한번 더 %10 이 들어가야한다.

값이 체크썸 값이 10이 떴을때는 틀렸다고 나온다.



  1. return ((10 - ((sum + Math.floor(key[8] * Number(bisNo[8]) / 10)) % 10)) % 10) == Number(bisNo[9]);



위에처럼 해야한다.



나 같은 경우는 아래처럼 나눠서 체크했다.

   function ckBisNo(bisNo)

    {

        // 넘어온 값의 정수만 추츨하여 문자열의 배열로 만들고 10자리 숫자인지 확인합니다.

        if ((bisNo = (bisNo+'').match(/\d{1}/g)).length != 10) { return false; }


        // 합 / 체크키

        var sum = 0, key = [1, 3, 7, 1, 3, 7, 1, 3, 5];


        // 0 ~ 8 까지 9개의 숫자를 체크키와 곱하여 합에더합니다.

        for (var i = 0 ; i < 9 ; i++) { sum += (key[i] * Number(bisNo[i])); }


        // 각 8번배열의 값을 곱한 후 10으로 나누고 내림하여 기존 합에 더합니다.

        // 다시 10의 나머지를 구한후 그 값을 10에서 빼면 이것이 검증번호 이며 기존 검증번호와 비교하면됩니다.

        

        // 체크섬구함

        var chkSum = 0;

        chkSum = Math.floor(key[8] * Number(bisNo[8]) / 10);

        // 체크섬 합계에 더해줌

        sum +=chkSum;

        var reminder = (10 - (sum % 10)) % 10;

        //값 비교

        if(reminder==Number(bisNo[9])) return true;

        return false;

    }

'컴퓨터 > JavaScript (jQuery)' 카테고리의 다른 글

jQuery에서 따옴표 처리하기  (0) 2018.05.24
정규식 패턴 종류  (0) 2018.04.27
Modal로 팝업 띄우기  (6) 2018.02.07
엔터 칠때 자동으로 클릭하기  (0) 2018.01.05
jQuery 동적 이벤트 on  (0) 2015.10.22
Posted by Tyson
2018. 2. 7. 16:40


모달로 긴급 공지를 띄우려고 한다.


뒷 배경은 검은색으로 입력 안되게 하고, 


닫기 눌렀을때, 창을 닫고 다른 작업 가능하게 하는 법이다.


많은 방법이 있는데, 초간단하게 띄우는 법으로 소개한다.


쿠키등은 나중에 포스팅하겠다.



밑에 사진처럼 띄우고 싶을때 하는법이다.





먼저 제이쿼리를 불러온다.


1
    <script src="https://code.jquery.com/jquery-latest.js"></script
cs



그 다음에, 모달 스타일을 만든다.

.modal 클래스는 전체를 반투명 검은색으로 만드는 거고, .modal-content가 글을 쓰는 곳이다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
    <style>
        /* The Modal (background) */
        .modal {
            display: none; /* Hidden by default */
            position: fixed; /* Stay in place */
            z-index: 1; /* Sit on top */
            left: 0;
            top: 0;
            width: 100%; /* Full width */
            height: 100%; /* Full height */
            overflow: auto; /* Enable scroll if needed */
            background-color: rgb(0,0,0); /* Fallback color */
            background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
        }
    
        /* Modal Content/Box */
        .modal-content {
            background-color: #fefefe;
            margin: 15% auto; /* 15% from the top and centered */
            padding: 20px;
            border: 1px solid #888;
            width: 30%; /* Could be more or less, depending on screen size */                          
        }
 
</style>
cs



밑에 보면, Modal 클래스랑, modal-content클래스가 있다.

그냥 스타일 써서, 내용은 작성한다.

그리고, 닫기 버튼 누를때, onClick="close_pop();

close_pop펑션이 실행되게 해놓는다.



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
    <!-- The Modal -->
    <div id="myModal" class="modal">
 
      <!-- Modal content -->
      <div class="modal-content">
                <p style="text-align: center;"><span style="font-size: 14pt;"><b><span style="font-size: 24pt;">공지</span></b></span></p>
                <p style="text-align: center; line-height: 1.5;"><br />여기에 내용</p>
                <p><br /></p>
            <div style="cursor:pointer;background-color:#DDDDDD;text-align: center;padding-bottom: 10px;padding-top: 10px;" onClick="close_pop();">
                <span class="pop_bt" style="font-size: 13pt;" >
                     닫기
                </span>
            </div>
      </div>
 
    </div>
        <!--End Modal-->
cs



자, 이제 거의 다 끝났다.

자바스크립트가 접속하면, 자동으로 모달을 보이게 하자. 


.show()를 하면, 보인다.


그리고, 아까 위에서 '닫기' 버튼을 눌렀을때,


.hide()를 써서 숨기면 된다!


1
2
3
4
5
6
7
8
9
10
11
    <script type="text/javascript">
      
        jQuery(document).ready(function() {
                $('#myModal').show();
        });
        //팝업 Close 기능
        function close_pop(flag) {
             $('#myModal').hide();
        };
        
    </script>
cs




여기에 쿠키 넣어서, 오늘은 그만보기버튼추가하는 것도 있는데,


그건 다음 포스트에 올리겠다.




밑에는 전체 소스이다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
    <script src="https://code.jquery.com/jquery-latest.js"></script
 
    <style>
        /* The Modal (background) */
        .modal {
            display: none; /* Hidden by default */
            position: fixed; /* Stay in place */
            z-index: 1; /* Sit on top */
            left: 0;
            top: 0;
            width: 100%; /* Full width */
            height: 100%; /* Full height */
            overflow: auto; /* Enable scroll if needed */
            background-color: rgb(0,0,0); /* Fallback color */
            background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
        }
    
        /* Modal Content/Box */
        .modal-content {
            background-color: #fefefe;
            margin: 15% auto; /* 15% from the top and centered */
            padding: 20px;
            border: 1px solid #888;
            width: 30%; /* Could be more or less, depending on screen size */                          
        }
 
</style>
 
 
 
    <!-- The Modal -->
    <div id="myModal" class="modal">
 
      <!-- Modal content -->
      <div class="modal-content">
                <p style="text-align: center;"><span style="font-size: 14pt;"><b><span style="font-size: 24pt;">공지</span></b></span></p>
                <p style="text-align: center; line-height: 1.5;"><br /></p>
                <p style="text-align: center; line-height: 1.5;"><span style="font-size: 14pt;">사이트 서버 점검으로</span></p>
                <p style="text-align: center; line-height: 1.5;"><b><span style="color: rgb(255, 0, 0); font-size: 14pt;">10:00 - 18:00 까지</span></b></p>
                <p style="text-align: center; line-height: 1.5;"><span style="font-size: 14pt;">사이트 사용이 중지 됩니다.</span></p>
                <p style="text-align: center; line-height: 1.5;"><span style="font-size: 14pt;"><br /></span></p>
                <p style="text-align: center; line-height: 1.5;"><span style="font-size: 14pt;">이용에 불편을 드린 점 양해를 </span></p>
                <p style="text-align: center; line-height: 1.5;"><span style="font-size: 14pt;">부탁드립니다.</span></p>
                <p style="text-align: center; line-height: 1.5;"><br /></p>
                <p><br /></p>
            <div style="cursor:pointer;background-color:#DDDDDD;text-align: center;padding-bottom: 10px;padding-top: 10px;" onClick="close_pop();">
                <span class="pop_bt" style="font-size: 13pt;" >
                     닫기
                </span>
            </div>
      </div>
 
    </div>
        <!--End Modal-->
 
 
    <script type="text/javascript">
      
        jQuery(document).ready(function() {
                $('#myModal').show();
        });
        //팝업 Close 기능
        function close_pop(flag) {
             $('#myModal').hide();
        };
        
 </script>
 

cs




참고 사이트 :http://new93helloworld.tistory.com/135

'컴퓨터 > JavaScript (jQuery)' 카테고리의 다른 글

jQuery에서 따옴표 처리하기  (0) 2018.05.24
정규식 패턴 종류  (0) 2018.04.27
사업자 등록번호 체크방법  (0) 2018.04.24
엔터 칠때 자동으로 클릭하기  (0) 2018.01.05
jQuery 동적 이벤트 on  (0) 2015.10.22
Posted by Tyson
2018. 1. 5. 11:28

웹 만들때, 엔터 치면, 입력값에서 자동으로 버튼 클릭하게 하는, 코드 


Modal 아이디에 있는 input에서 엔터를 칠때, #save-btn 를 클릭하라는 말이다.


1
2
3
4
5
6
7
8
9
10
11
12
13
    $('#modal').on('keypress''input'function(e) {
 
        var keyCode = e.keyCode || e.which;
 
        if (keyCode === 13) {
 
            e.preventDefault();
 
            $('#save-btn').trigger('click');
 
        }
 
    });
cs


'컴퓨터 > JavaScript (jQuery)' 카테고리의 다른 글

jQuery에서 따옴표 처리하기  (0) 2018.05.24
정규식 패턴 종류  (0) 2018.04.27
사업자 등록번호 체크방법  (0) 2018.04.24
Modal로 팝업 띄우기  (6) 2018.02.07
jQuery 동적 이벤트 on  (0) 2015.10.22
Posted by Tyson
2015. 10. 22. 14:15

   클릭시 다운로드 하는거 만들때, 

click 이랑 on 차이??

on를 쓰면 나중에 추가되는 태그들도 먹힌다. 예로, file_down 클래스는 나중에 모달로, 창이 뜨니,

click에서는 file_down 클래스가 먹히지 않는다.


그래서 on를 쓴다.

근데, on의 순서??

 $('.row').on('click','.file_down',function()

  1.이벤트가 먹히는 클래스/2.클릭이벤트/3.file_down클래스가 클릭했을때 아래 이벤트를 1번 클래스해 한다?



 jQuery(document).ready(function(){

        $('.file_down').click(function(){

           var url = 'ajax_download?report_no='+report_no;

            location.href = url;

        });

    });

    <script type="text/javascript">

    jQuery(document).ready(function(){

        $('.row').on('click','.file_down',function(){

            var url = 'ajax_download?report_no='+report_no;

            location.href = url;

        });

    });

    </script>

'컴퓨터 > JavaScript (jQuery)' 카테고리의 다른 글

jQuery에서 따옴표 처리하기  (0) 2018.05.24
정규식 패턴 종류  (0) 2018.04.27
사업자 등록번호 체크방법  (0) 2018.04.24
Modal로 팝업 띄우기  (6) 2018.02.07
엔터 칠때 자동으로 클릭하기  (0) 2018.01.05
Posted by Tyson