개발에 해당되는 글 144건

[자바스크립트] 숫자만 입력

개발/코딩 2017. 11. 13. 14:42

보통 input 타입으로 숫자만 입력 받게 하기 위해서는

<input type="number"> 이런식으로 타입을 지정해준다.

 

그런데 아이폰의 경우에는 다른 문자까지 입력이 가능해서 찾아보니.

<input type="number" pattern="[0-9]*" inputmode="numeric" min="0"/>

이런식으로 코딩을 해주면 숫자만 입력 가능하게 해준다.

 

 

스크립트로 제어 하는 방법

input type="test" 에 onkeydown="return isNumber(event)" 을 추가하고

 

<script>

   function isNumber(event)
   {
    event = event || window.event;
    var keyID = (event.which) ? event.which : event.keyCode;

     if( ( keyID >=48 && keyID <= 57 ) || ( keyID >=96 && keyID <= 105 ) || keyID == 8 || keyID == 46 || keyID == 37 || keyID == 39 )
    {
     return;
    }
    else
    {
     return false;
    }

   }

</script>

 

이렇게 해주면 숫자와 편집키만 입력이 가능하다.

'개발 > 코딩' 카테고리의 다른 글

[자바스크립트] 엔터 누르면 조회, 로그인  (0) 2018.01.29
자바스크립트 - alert 창 꾸미기  (0) 2017.12.08
특정 화면 위치로 자동 스크롤  (0) 2017.06.05
JSP 이미지 파일 리사이즈  (0) 2017.05.24
아이디 입력시 특수문자 확인  (0) 2017.04.20
,

자바스크립트, style 블럭처리 display none,block,inline

개발/실전 2017. 10. 31. 18:07

1)

jQuery로 이용 하는 방법

 

$("#아이디").hide();

$("#아이디").show();

 

그런데...

다른 사람 컴퓨터에서는 숨기는건 됐는데 다시 보여주는게 안먹었다....

그래서 2) 방법으로

 

2)

아래처럼 사용을 하면 자바스크립트로 div,tr, td, button 등 블록처리가 가능하다.

 

document.getElementById('아이디').style.display="block";
document.getElementById('아이디').style.display="none"; 

 

그런데...

버튼이 나란히 옆으로 나와야 하는데

숨겨져있던 버튼이 다시 나오면서 버튼 밑으로 보여지는 현상이...

그래서 3) 방법으로

 

3)

div로 처리하면 버튼이 텍스트박스 아래로 내려가는 경우가 있는데 그럴때는 다른방법으로~

div대신 <span>태그로 버튼을 만들고 처리를 하면 된다. 대신 inline으로.

 

     <span id="아이디" style="display: none;">
      <button onclick="aaa()">검색</button>
     </span>

 

document.getElementById('아이디').style.display="inline";
document.getElementById('아이디').style.display="none"; 

 

'개발 > 실전' 카테고리의 다른 글

PermGen Space 에러  (0) 2018.08.14
이클립스 세로줄 플러그인  (0) 2018.03.23
자바스크립트 날짜 계산  (0) 2016.06.20
더보기 클릭 했을때  (0) 2016.03.30
시간 지나면 자동으로 페이지 이동  (0) 2015.12.02
,

input 붙여 넣기 방지

개발/jQuery 2017. 10. 17. 15:07

 

$("#objTBs1_0").bind('paste',function(e){
        var el = $(this);
        setTimeout(function(){
            var text = $(el).val();
            $("#objTBs1_0").val("");  //해당 text의 ID의 값을 초기화 시켜준다
        },100);
});

'개발 > jQuery' 카테고리의 다른 글

숫자만 입력  (0) 2020.03.05
대표적인 getter 메소드와 setter 메소드  (0) 2017.07.12
input 요소 선택  (0) 2017.07.12
jQuery 선택자  (0) 2017.07.12
비슷한 ID 가져오기  (0) 2017.07.07
,

ASP에서 난수 발생( 로또 )

개발/ASP 2017. 7. 20. 10:25

jsp 에서 코딩하는거랑 좀 다르다... 좀더 어렵다고 할까나..

 

asp에서는

   '난수 발생 START  
   Dim lotto(10) '10개 배열 생성
   randomize
   For i =1 To 9 Step 1
     A = int(rnd()*9) + 1 ' 난수 할당
     For y=1 To i Step 1
      If lotto(y) = A  Then
       A = 0
       y = i+1 '중복 번호가 나오면 i 보다 크게 해서 for 빠져나온다
       i = i-1 '카운트가 증가 됐던것을 다시 감소
      End If
     Next
     If A <> 0 then
      lotto(i) = A
     End if
   Next
   '난수 발생 END'

 

 

jsp에서는

 

   Random rand = new Random(); // 랜덤 함수
   int[] Lotto = new int[10]; // 배열 선언, 초기화
   for(int k =1; k<=9;k++)
   {
    
     A=rand.nextInt(9) + 1; //  0부터 시작하므로 +1
     for(y=0;y<=k;y++)
     {
      if(A==Lotto[y])
      {
       A=rand.nextInt(9) + 1; // 0부터 시작하므로 +1. 중복값이므로 다시 난수를 부여
       y = -1;          //j++ 값을 상쇄시켜주기 위해(증감을 막음. 비교하기 위해서)
      }
     }
     Lotto[k]=A;

    }

 

이런식으로 했었는데

,

인터넷 익스플로러 탭을 새창으로

개발 2017. 7. 17. 10:55

1. 윈도우키 + R

2. regedit 입력

3. HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main 의 경로로 들어간다

4. TabProcGrowth 을 찾는다, 없을 경우에는 마우스 우클릭 > 새로 만들기 > DWORD 선택 해서 만든다.

5. TabProcGrowth을 더블클릭후 데이터 값을 1을 넣어준다.

6. 재부팅 한다

 

끝~

,

대표적인 getter 메소드와 setter 메소드

개발/jQuery 2017. 7. 12. 14:16

<!DOCTYPE html>
<html lang="ko">

<head>
 <meta charset="UTF-8">
 <title>jQuery Element Access</title>
 <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
 <script>
  $(function() {
   $("button").on("click", function() {
    // <img>요소의 src 속성값을 읽어오는 getter 메소드
    var imgSrc = $("img").attr("src");
    // <img>요소의 src 속성값을 새로운 값으로 설정하는 setter 메소드
    $("img").attr("src", "/examples/images/img_flag.png");
   });
  });
 </script>
</head>

<body>

 <h1>.attr() 메소드</h1>
 <p>아래의 버튼을 누르면 다음 이미지를 변경할 수 있어요!!</p>
 <button>src 속성 변경!</button><br><br>
 <img src="/examples/images/img_flower.png" style="width:320px; height:214px; border: 1px solid black">
</body>

</html>

 

 

메소드 설명
.html() 해당 요소의 HTML 콘텐츠를 반환하거나 설정함.
.text() 해당 요소의 텍스트 콘텐츠를 반환하거나 설정함.
.width() 선택한 요소 중에서 첫 번째 요소의 너비를 픽셀 단위의 정수로 반환하거나 설정함.
.height() 선택한 요소 중에서 첫 번째 요소의 높이를 픽셀 단위의 정수로 반환하거나 설정함.
.attr() 해당 요소의 명시된 속성의 속성값을 반환하거나 설정함.
.position() 선택한 요소 중에서 첫 번째 요소에 대해 특정 위치에 존재하는 객체를 반환함. (getter 메소드)
.val() <form>요소의 값을 반환하거나 설정함.

 

출처 tcp스쿨

'개발 > jQuery' 카테고리의 다른 글

숫자만 입력  (0) 2020.03.05
input 붙여 넣기 방지  (0) 2017.10.17
input 요소 선택  (0) 2017.07.12
jQuery 선택자  (0) 2017.07.12
비슷한 ID 가져오기  (0) 2017.07.07
,

input 요소 선택

개발/jQuery 2017. 7. 12. 10:53

<!DOCTYPE html>
<html lang="ko">

<head>
 <meta charset="UTF-8">
 <title>jQuery Element Selection</title>
 <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
 <script>
  $(function() {
   $("button").on("click", function() {
    // 체크되어 있는 요소를 모두 선택함.
    $(":checked").next().text("체크되어 있는 요소는 이 요소입니다.");
   });
  });
 </script>
</head>

<body>

 <h1>Form 요소의 선택</h1>

 <form>
  <input type="checkbox" name="lecture" value="html"> <span>HTML</span> <br>
  <input type="checkbox" name="lecture" value="css"> <span>CSS</span> <br>
  <input type="checkbox" name="lecture" value="javascript"> <span>자바스크립트</span> <br>
  <input type="checkbox" name="lecture" value="jquery" checked> <span>제이쿼리</span>
 </form>
 <button>필터링</button>
 
</body>

</html>

 

위 소스에서 버튼을 클릭하면 체크 되어 있는 문항들의 텍스트가 변경 된다

 

선택자 설명
:button type 속성값이 "button"인 요소를 모두 선택함.
:checkbox type 속성값이 "checkbox"인 요소를 모두 선택함.
:file type 속성값이 "file"인 요소를 모두 선택함.
:image type 속성값이 "image"인 요소를 모두 선택함.
:password type 속성값이 "password"인 요소를 모두 선택함.
:radio type 속성값이 "radio"인 요소를 모두 선택함.
:reset type 속성값이 "reset"인 요소를 모두 선택함.
:submit type 속성값이 "submit"인 요소를 모두 선택함.
:text type 속성값이 "text"인 요소를 모두 선택함.
:input <input>, <textarea>, <select>, <button>요소를 모두 선택함.
:checked type 속성값이 "checkbox" 또는 "radio"인 요소 중에서 체크되어 있는 요소를 모두 선택함.
:selected <option>요소 중에서 선택된 요소를 모두 선택함.
:focus 현재 포커스가 가지고 있는 요소를 선택함.
:disabled 비활성화되어있는 요소를 모두 선택함.
:enabled 활성화되어있는 요소를 모두 선택함.

 

출처 tcp스쿨

'개발 > jQuery' 카테고리의 다른 글

input 붙여 넣기 방지  (0) 2017.10.17
대표적인 getter 메소드와 setter 메소드  (0) 2017.07.12
jQuery 선택자  (0) 2017.07.12
비슷한 ID 가져오기  (0) 2017.07.07
jQuery - select box 선택값 가져오기  (0) 2017.01.18
,

jQuery 선택자

개발/jQuery 2017. 7. 12. 09:23

<!DOCTYPE html>
<html lang="ko">

<head>
 <meta charset="UTF-8">
 <title>jQuery Element Selection</title>
 <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
 <script>
  $(function() {
   $("button").on("click", function() {
    $("li:has(span)").text("<span>요소를 가지고 있는 아이템이에요!");
   });
  });
 </script>
</head>

<body>

 <h1>선택한 요소의 필터링</h1>

 <ul>
  <li>첫 번째 아이템이에요!</li>
  <li><span>두 번째</span> 아이템이에요!</li>
  <li>세 번째 아이템이에요!</li>
 </ul>
 <button>필터링</button>
 
</body>

</html>

 

위 소스에서 필터링 이란 버튼을 클릭하면 li 태그 중 span을 가지고 있는 두번째 아이템의 텍스트가 변경 된다.

 

선택자 설명
:eq(n) 선택한 요소 중에서 인덱스가 n인 요소를 선택함.
:gt(n) 선택한 요소 중에서 인덱스가 n보다 큰 요소를 모두 선택함.
:lt(n) 선택한 요소 중에서 인덱스가 n보다 작은 요소를 모두 선택함.
:even 선택한 요소 중에서 인덱스가 짝수인 요소를 모두 선택함.
:odd 선택한 요소 중에서 인덱스가 홀수인 요소를 모두 선택함.
:first 선택한 요소 중에서 첫 번째 요소를 선택함.
:last 선택한 요소 중에서 마지막 요소를 선택함.
:animated 선택한 요소 중에서 애니메이션 효과가 실행 중인 요소를 모두 선택함.
:header 선택한 요소 중에서 h1부터 h6까지의 요소를 모두 선택함.
:lang(언어) 선택한 요소 중에서 지정한 언어의 요소를 모두 선택함.
:not(선택자) 선택한 요소 중에서 지정한 선택자와 일치하지 않는 요소를 모두 선택함.
:root 선택한 요소 중에서 최상위 루트 요소를 선택함.
:target 선택한 요소 중에서 웹 페이지 URI의 fragment 식별자와 일치하는 요소를 모두 선택함.
:contains(텍스트) 선택한 요소 중에서 지정한 텍스트를 포함하는 요소를 모두 선택함.
:has(선택자) 선택한 요소 중에서 지정한 선택자와 일치하는 자손 요소를 갖는 요소를 모두 선택함.
:empty 선택한 요소 중에서 자식 요소를 가지고 있지 않은 요소를 모두 선택함.
:parent 선택한 요소 중에서 자식 요소를 가지고 있는 요소를 모두 선택함.

 

 

 

출처 : tcp스쿨

'개발 > jQuery' 카테고리의 다른 글

대표적인 getter 메소드와 setter 메소드  (0) 2017.07.12
input 요소 선택  (0) 2017.07.12
비슷한 ID 가져오기  (0) 2017.07.07
jQuery - select box 선택값 가져오기  (0) 2017.01.18
jQuery - serialize()란? 사용방법  (0) 2017.01.18
,

비슷한 ID 가져오기

개발/jQuery 2017. 7. 7. 09:04

 

$("[id*='menu']");//menu를 포함하는


$("[id^='menu']");//menu로 시작하는


$("[id$='menu']");//menu로 끝 나는

 

같이 쓰려면

$("[id^='menu']"&&"[id$='_01']");  //menu로 시작하면서 _01로 끝나는 것을 찾을 수 있다.

 

추가로 체크된 박스 갯수 가져오기

var bb= $("[id^=objCBL1]:checked").length;  //objCBL1 로 시작하는 체크박스에서 체크된 갯수를 가져온다

별 신기한 것들이 다 있네

'개발 > jQuery' 카테고리의 다른 글

대표적인 getter 메소드와 setter 메소드  (0) 2017.07.12
input 요소 선택  (0) 2017.07.12
jQuery 선택자  (0) 2017.07.12
jQuery - select box 선택값 가져오기  (0) 2017.01.18
jQuery - serialize()란? 사용방법  (0) 2017.01.18
,

특정 화면 위치로 자동 스크롤

개발/코딩 2017. 6. 5. 10:45

1.

페이지를 클릭하자 마자

자동으로 원하는 페이지 위치를 보여주고 싶으면

해당 위치에 <div id = "test"> 을 넣어주고

 

<script language="javascript">
   document.getElementById("test").scrollIntoView();
 </script>

 

이렇게만 해주면 자동으로 해당 아이디 위치로 화면을 보여주게 된다.

 

2.

해당 위치로 글을 읽듯이 내려가게 하고 싶다면 (위에는 클릭하자 마자 바로 짠 하고 보여줌)

 

<body onload="scroller()">

 

페이지 들어오면 scroller() 를 호출

 

 <script language="javascript">

   var position = 0;
    function scroller()
   {
   if (position != 500)
   {
    position++;
    scroll(0,position);
    clearTimeout(timer);
    var timer = setTimeout("scroller()",10); timer;
   }
  }
</script>

 

여기서 500은 세로높이, 10은 이동 속도이다.

'개발 > 코딩' 카테고리의 다른 글

자바스크립트 - alert 창 꾸미기  (0) 2017.12.08
[자바스크립트] 숫자만 입력  (0) 2017.11.13
JSP 이미지 파일 리사이즈  (0) 2017.05.24
아이디 입력시 특수문자 확인  (0) 2017.04.20
JSP 드래그, 오른쪽 클릭 막기  (0) 2017.01.25
,
1 2 3 4 5 6 7 ··· 15

티스토리툴바