웹마스터 팁

안녕하세요 아무흐 입니다. 요번강의에서는 간단히 폼구구단을 만드는것에 배워 보도록 하겠습니다.

오늘 배울 구믄은 딱히 없지만 몇가지 새로운 구문을 배워볼 예정입니다. ^^

원래는 폼 계산기를 넣으려 했으나 지금 이걸 배우면 좀 머리 복잡할꺼 같아 좀더 쉬운것을 먼저 배워 보았습니다.

1. Form 폼 과 for 문

요번강의에서는 폼과 for 문에 대해 배워 보겠습니다. Form 문이라면 바로 Html 의 Form 이라는걸
Html 을 다뤄 본사람을 잘 아실껍니다. 우리가 사용하는 게시판에서도 많이 사용되는 것중 하나가 폼입니다.

오늘은 이 것들을 배워 볼텐데요 우선 소스를 보면서 알아보겠습니다.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>폼 구구단 계산기</title>
</head>
<body>
<table width="200" border="1"><form method="post" action="form_php6.php">
  <tr>
    <td><input type="text" style=" width:150px; height:16px; font-size:11px;" name="form"></td>
    <td width="66"><input type="submit" name="Submit" style="width:50px; height:16px; font-size:11px; color:#333333" value="계산"></td>
  </tr>
  <tr>
    <td colspan="2"><?
 if($form==""){
 
 } else {
 for($i=1;$i<=9;$i++){
  echo $form."*".$i."=".$form*$i."<br>";
 }
 }
 ?></td>
    </tr>
</form>
</table>
</html>

소스는 다음과 같습니다. 자 그럼 Form 에 대해 설명 하겠습니다.

우선 폼은 폼을 사용하여 PHP 로 데이터를 입력하고 전달할때 가장 많이 쓰이는 태그중 하나 입니다.

폼 폼은 대개 <form 으로 시작하며 method 값과 action 값 또는 name 값을 주게 되어 있습니다.

이 소스에서 보면 method 값을 post 로 주었습니다. 이건 바로 보낸다는 뜻입니다. action 에 있는 form_php6.php 값에

값을 보낸다
는 뜻입니다.현재 이 소스 자체가 form_php6.php 이므로 바로 이 폼 소스로 데이터를 전송 시키겠죠

폼이 데이터 전송하는 경로를 알았으니 어떤 데이터를 보내는지는 알지 못합니다. <form> 태그와 </form> 태그 사이중

<input type="text" style=" width:150px; height:16px; font-size:11px;" name="form"> 라는 태그가 있습니다. 이태그를 보면

type 과 style 그리고 name 이라는 태그가 있습니다. type 은 폼의 방식, 모양 등을 정할때 쓰입니다. 텍스트 박스는 text

폼은 button, hidden, password, radio, reset, submit, image 등의 종류가 있으며 그 종류에 따라 폼의 활용이 달라

지게 됩니다. 그리고 style 은 제가 그냥 스타일 시트 css 같이 스타일 값을 넣어 준것입니다. 즉 꾸며줬다는 거죠 ^^

그리고 name 에는 form 값을 주었습니다. 여기서 form  이란 값은 전송 데이터의 변수값이 됩니다. 만약 변수값이

틀리다면 전송 하더라도 변수값을 못받아서 php 프로그램이 작동하지 않을 수도 있으니 주의 주의 ^_^

대략 폼값도 알아 보았습니다. 그 뒤에 있는 submit 타입의 폼은 바로 전송 버튼입니다. 그 버튼을 클릭하면 전송이

가능하겠죠 ^^

자 그럼 우선 이미지를 하나 보도록 하겠습니다.
form 1.jpg
자 이 이미지는 위의 소스대로 만든 페이지를 본 화면 입니다. 이 화면에서 보면 폼 하나가 있고 계산이라는 폼이

있습니다. 저 폼안에 9 라는 값을 넣어 계산을 하게 되면
form 2.jpg
이와 같이 폼 밑에 계산 한것을 나타나게 됩니다. 이때 주로 쓰이는 PHP 구문은 FOR 문입니다.

for 문의 사용방법은 이러합니다.

for(숫자변수 하나를 지정 ;  숫자 변수를 몇번 실행할지 조건 지장  ;  숫자 변수를 더할지 뺄지를 지정){
      프로그램 구문
}

※여기서도 else 가 먹힙니다. ^^

for 문의 사용법은 위와 같습니다. 그럼 소스를 보면서 생각해봅시다.

<?
 if($form==""){
 
 } else {
 for($i=1;$i<=9;$i++){
  echo $form."*".$i."=".$form*$i."<br>";
 }
 }
 ?>

우선 첫번째 이미지처럼 처음에는 for 문에 들어갈 값이 나타나는걸 막기 위해

if 조건문을 이용하여서

$form 값이 아무것도 없이 비어 있을 때에는 아무 프로그램도 실행 시키지 않습니다.

하지만 숫자가 들어 있을 때에는 프로그램을 실행 시킵니다. else 로 숫자가 들어가면

실행
되는거죠 ^^

단 여기서 숫자를 넣지 않으면 계산이 안된다는 점을 꼭 생각해두셔야겠죠 ^^

if 문으로 폼에 아무것도 없을때가 아닌 폼에 숫자가 들어 갔을때 실행 하라는 조건을 걸어 주었습니다.

그럼 for 문은 어떻게 사용한걸까요?

변수 i 값을 1이라고 지정하고 변수 i 값이 9과 작거나 같을때까지 실행 시켜라 는 조건을 주고 또 변수 i 값을

증감 시키라 조건을 줍니다.

※ 증감 이란? 숫자 변수를 계산 할때에 1씩 또는 -1 증감 시키는 것이 바로 증감인데 변수 뒤에 ++를 넣었을 경우에는
     변수의 숫자값이 증가하고 --를 넣었을 경우에는 변수의 숫자 값이 감소한다.

즘감 조건을 주었으니 이제 에코 문을 이용하여 어떻게 출력해서 보여 줄지를 작성 해야겠지요^^

echo 를 넣어 주고 $form 값을 넣어 주어

ㅁ * ㅁ = ㅁ 중 맨앞에 ㅁ 값을 넣도록 합니다.

echo $form    여기서 form변수 뒤에 . (점) 을 넣어 뒤에 구문도 합칩니다.

※ 여기서 잠깐 ! . 은 변수값를 합칠때 주로 사용됩니다. ex ) $char = $int.$int;

이어서 "*"라는 문자열을 넣고 요번에는 $i 값을 넣어 줍니다. 또 "=" 이라는 문자열을 넣어 주고

$form 을 과 $i를 곱하는 $form*$i 를 넣어주고 ; 를 넣으면 끝 !

간단한데 설명은 기네요 - -....

질문 사항이 있으면 OGIT  메뉴에서 Q&A 매뉴에서 질문하세요 !! 제가 정성 껏 답변 해드리겠습니다.

푸푸 ..

이번강의는 이것으로 마치겠습니다.


제목 글쓴이 날짜
Javascript + 플래시 칼라피커 [6] 행복한고니 2004.10.08
체크박스를 이미지로 사용하기 [7] 행복한고니 2004.10.10
배열 스크립트 종합선물세트 행복한고니 2004.10.12
멀티 파일다운로드 꼼수 (새창버전) [1] 행복한고니 2004.10.14
XP2인지 체크하여 XP2일때는 팝업허용하라는 메시지 뛰워주기 [3] 아돌 2004.10.19
모든 이미지, 텍스트 링크에 점선 없애기 [5] 이강민 2004.10.25
JavaScript 구문강조 효과내기 파우링 2004.10.28
행복한고니님의 체크박스를 이미지로 사용하기를 보고... 체크박스옆에 텍스트 부치기 [2] beMax 2004.10.29
ActiveX 멀티파일업로더 입니다. [9] by風 2004.11.01
홈페이지 나갈때 새창띄우기 [2] piasol 2004.11.07
(수정)배경음악,연월일,시간, 코멘트 셋트.(AM,PM==>오전,오후 순,한국식으로 ...) [4] 민피디 2004.11.10
ActiveX 플래시 이미지캡쳐 컨트롤 iFlower [1] 덴디 2004.11.15
iFlower 윈도우리스 플래시 ActiveX 컨트롤 덴디 2004.11.16
자바스크립트 암호화 [5] 손상모 2004.11.18
로딩중인 페이지에 효과넣기 [4] LUFFY 2004.11.20
이미지 를 브라우져에서 내맘데로 옮겨두기 [8] piasol 2004.12.03
이제 미디어플레이어는 가라? 곰플레이어로 실시간으로 감상하자. [13] ⓣing★™ 2004.12.05
홈페이지를 풀스크린으로 띄우자 - 올플래시로 보이는군요. [21] Multi_Taeji 2004.12.10
마우스를 대면 이미지가 바뀐다. 롤오버 이미지 [3] 하진 2004.12.19
개판 오분전 빙고 [2] 미친개 2004.12.30