[JS] 자바스크립트 form 있는 값 사칙연산하기 (덧셈,뺄샘,곱셈,나눗셈)

2022. 8. 30. 21:30· 기존(310)/🏀JavaScript
목차
  1. Form 에 있는 값을 더해보기
  2. Script  check() 생성하기

 

Form 에 있는 값을 더해보기

 

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>


</head>
<body>


<form name="test">

<input type="text" name="a" value="100">
<input type="text" name="b" value="100">
<input type="button" value="사칙연산" onclick="check()">

</form>


</body>
</html>

Script  check() 생성하기

 

 

사칙연산 버튼을 클릭하게 되면

 

 

이렇게 값이 나타나는걸 확인해볼수 있습니다.

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>

<script>

function check(){
	
	x=parseInt(document.test.a.value); // 웹페이지에 form 네임값에 a 에있는 value 값 =100;
	y=parseInt(document.test.b.value); // 웹페이지에 form 네임값에 b 에있는 value 값 =100;
	
	document.write(x+y+"<br>"); // 100+100 = 200
	document.write(x-y+"<br>"); // 100 - 100 = 0
	document.write(x*y+"<br>"); // 100 * 100 =10000
	document.write(x/y+"<br>"); // 100 / 100 = 1
	document.write(x%y+"<br>");//
}

</script>


</head>
<body>


<form name="test">

<input type="text" name="a" value="100">
<input type="text" name="b" value="100">
<input type="button" value="사칙연산" onclick="check()">

</form>


</body>
</html>

 

저작자표시 (새창열림)

'기존 > 🏀JavaScript' 카테고리의 다른 글

[JS] 자바스크립트 HTML 요소 선택 getElementById 실습하기 - 2  (0) 2022.08.30
[JS] 자바스크립트 HTML 요소 선택 getElementById 실습하기 - 1  (0) 2022.08.30
[JS] 자바스크립트 자료형 변수 Var 사용법 ( typeof 타입 확인)  (0) 2022.08.30
[JS] 자바스크립트 인라인 , 함수사용해서 사용하는 자바스크립트 사용법  (0) 2022.08.30
[JS] 자바스크립트 console.log , document 사용법  (0) 2022.08.30
  1. Form 에 있는 값을 더해보기
  2. Script  check() 생성하기
'기존(310)/🏀JavaScript' 카테고리의 다른 글
  • [JS] 자바스크립트 HTML 요소 선택 getElementById 실습하기 - 2
  • [JS] 자바스크립트 HTML 요소 선택 getElementById 실습하기 - 1
  • [JS] 자바스크립트 자료형 변수 Var 사용법 ( typeof 타입 확인)
  • [JS] 자바스크립트 인라인 , 함수사용해서 사용하는 자바스크립트 사용법
조각남자
조각남자
프로그래밍 기술 및 저장소
조각남자
조각남자
조각남자
전체
오늘
어제
  • 전체 보기
    • Java
      • Spring
    • 기존
      • 🏀Jsp
      • 🏀Spring
      • 🏀Pom.xml
      • 🏀SpringBoot
      • 🏀JavaExcption
      • 🏀JavaDB
      • 🏀SpringBootCloneWebSite
      • 🏀SptringDependency
      • 🏀JpaEnvorinoment
      • 🏀Thymeleaf
      • 🏀Node
      • 🏀Pyton
      • 🏀DataBase
      • 🏀JavaScript
      • 🏀Android
      • 🏀JPA
      • 🏀Flutter
      • 🐸Utils
      • 🎫 Batch
      • 🎞️JenKins
      • 🎈Python
      • 🎗️AWS
      • 🦠Vue
      • 🐳React
      • 🖲️kafka
      • Next.js

공지사항

  • 공지사항

인기 글

태그

  • D

최근 댓글

최근 글

hELLO · Designed By 정상우.v4.2.1
조각남자
[JS] 자바스크립트 form 있는 값 사칙연산하기 (덧셈,뺄샘,곱셈,나눗셈)
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.