2017년 3월 24일 금요일

뉴비가 배운 jsp 사용법

jsp파일을html에서 import 한뒤 해당 jsp파일의 메소드를 구동하고싶은게 첫번째 문제였고,
두번째 문제는 그 메소드에 인자값을 전달해서 제사용을 하고싶었습니다.

아래에 코드는D-Day 카운트용 .js 파일입니다.
--------------------------------------------------
 /*
 filename=test.js
*/

var val1;   //변수 val1 선언, 이곳에서 html에서 string타입으로 날자를 받아올것
var count;  //변수 count 선언, 이곳에서 list번호 확인을 위해 int타입으로 숫자를 받을것
function test1(val1,count) {
//java에서 마치 method를 쓴다는 의미의 function, 인자값을 받는다
    var countDownDate1 = new Date(val1).getTime();
    //받은 val1을 날짜로 인식시키고 숫자로 바꾼다
    var now = new Date().getTime();
    //이 변수는 현제시간을 입력한다
    var distance = countDownDate1 - now;
    // 위 입력된 두 값을 바꿔서 남은시간을 계신한다.
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    //내가 필요한것은 날짜이기 떄문에, 쓸모없는 시 분 초 는 제외하기위해 사용   
    if (distance <= -1) {
        document.getElementById("list"+count).innerHTML = "마감";
    }
    //만일 카운트가 -1 이하가 될시에 마감 이라는 단어를 띄우도록 한다
    else{
        document.getElementById("list"+count).innerHTML = "D -" + days;
    }   
    //아니면 D-남은날짜!
}


//html head 부분에서 아래 코드를 입력한다
//<script type="text/javascript" src=" filename.js "></script>
//사용하고싶은 위치에 id 를 list+num 으로 만든다음, 스크립트를 쓴다고 선언하고,
//메소드이름과 인자값(string,int)를 넘겨준다.
//여기서 인자값 string 은 d-day count 날짜이며, int 는 list의 뒷번호이다.
//<p id="list1"><script type = "text/javascript">test1("Jan 5,2019",1)</script></p>


------------------------------------------------------
------------------------------------------------------

html에서 id값이 list1 list2 list3 이 선언되어있고, 각각의 태그에 js의 평션을 이용해 값을 바꿉니다.

eg)
<p id="list1"><script type = "text/javascript">test1("Jan 5,2019",1)</script></p>
<p id="list2"><script type = "text/javascript">test1("Jan 6,2019",2)</script></p>


댓글 없음:

댓글 쓰기