샘이랑 똑같이쳣는데 왜 입력이 안될가여
293
방세혁
작성한 질문수 8
0
함수도 호출햇고 리턴값을 함수로호출햇는데 왜 샘이 랑 똑같이 쳣는지 버튼을 눌러도 숫자가 입력이 안되나여
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>계산기</title>
<style>
* { box-sizing: border-box }
#result { width: 180px; height: 50px; margin: 5px; text-align: right }
#operator { width: 50px; height: 50px; margin: 5px; text-align: center }
button { width: 50px; height: 50px; margin: 5px }
</style>
</head>
<!-- 계산기 버튼 구현 -->
<body>
<head>
<meta charset="utf-8">
<title>계산기</title>
<style>
* { box-sizing: border-box }
#result { width: 180px; height: 50px; margin: 5px; text-align: right }
#operator { width: 50px; height: 50px; margin: 5px; text-align: center }
button { width: 50px; height: 50px; margin: 5px }
</style>
</head>
<!-- 계산기 버튼 구현 -->
<body>
<input readonly id="operator">
<input readonly type="number" id="result">
<div class="row">
<button id="num-7">7</button>
<button id="num-8">8</button>
<button id="num-9">9</button>
<button id="plus">+</button>
</div>
<div class="row">
<button id="num-4">4</button>
<button id="num-5">5</button>
<button id="num-6">6</button>
<button id="minus">-</button>
</div>
<div class="row">
<button id="num-1">1</button>
<button id="num-2">2</button>
<button id="num-3">3</button>
<button id="divide">/</button>
</div>
<div class="row">
<button id="clear">C</button>
<button id="num-0">0</button>
<button id="calculate">=</button>
<button id="multiply">x</button>
</div>
<script>
let numOne='';
let operator='';
let numTwo='';
// 이두개가 왜쓰엿는지는 강의를 들으면서 알아보자
const $operator =document.querySelector('#operator');
const $result = document.querySelector('#result');
// 중복울 제거 햇기떄문에 변수로 넣어줌
const onClickNumber =
(number) =>
// if(operator){
// numberTwo +=number;
// }
// else{
// numberOne += number;
// }
// $result.value+=number;
//return undefined;
/// 반환하니 반환 할놈이 없으니 나오지도 않는다
// 그래서 언디 파인드를 넣지말고 함수를 넣어야 한다
//함수를 리턴해주는거다
// 실행되는것을 함수안으러 넣어주어야 한다
(event) => {
if(operator){
numberTwo +=number;
}
else{
numberOne += number;
}
$result.value += number;
};
// 넘버1 에 클릭이벤트 가 발생햇을떄 함수 실행한다
//$input.addEventListener('input',writing);
// 인풋 이벤트가 발생되면 안에 함수를 넣는다
// 넘버 0 인 아이디를 선택하고 클릭이벤트 발생햇을떄 이벤트 리스너를
// 추가한다
// 함수에서 중복이 발생하면 다른 부분들을 매개변수로 뺴라
document.querySelector('#num-0') .addEventListener('click', onClickNumber('0'));
document.querySelector('#num-1') .addEventListener('click', onClickNumber('1'));
document.querySelector('#num-2') .addEventListener('click', onClickNumber('2'));
document.querySelector('#num-3') .addEventListener('click', onClickNumber('3'));
document.querySelector('#num-4') .addEventListener('click', onClickNumber('4'));
document.querySelector('#num-5') .addEventListener('click', onClickNumber('5'));
document.querySelector('#num-6') .addEventListener('click', onClickNumber('6'));
document.querySelector('#num-7') .addEventListener('click', onClickNumber('7'));
document.querySelector('#num-8') .addEventListener('click', onClickNumber('8'));
document.querySelector('#num-9') .addEventListener('click', onClickNumber('9'));
// 이런식으로 함수의 중복이 발생이되엇을떄 중복을 함수로 뺴서 중복을 피해라;
document.querySelector('#plus') .addEventListener('click', () => {} );
document.querySelector('#minus') .addEventListener('click', () => {} );
document.querySelector('#divide') .addEventListener('click', () => {} );
document.querySelector('#num-1') .addEventListener('click', () => {} );
document.querySelector('#multiply') .addEventListener('click', () => {} );
document.querySelector('#calculate') .addEventListener('click', () => {} );
document.querySelector('#clear') .addEventListener('click', () => {} );
</script>
</body>
</html>
답변 1
자바스크립트 입문 강의 재생 안됨
0
76
2
쿵쿵따 조건문 질문입니다.
0
72
2
렛츠가릿 자바스트립트와 공유가 되나요
0
77
1
수강을 하기 전 공부순서에 관한 질문이 있습니다.
1
100
2
안녕하세요
0
101
2
1~45 필터링하는 코드에서 find대신 some써주는게 나을거같습니다.
1
76
2
고차 함수 작성법과 수업 진도 관련한 질문
0
82
3
break와 continue 9:55 내 continue 구문 질문
0
153
2
옵셔널 체이닝 적당한 깊이는 어느 정도인가요?
0
121
2
로또 추첨기 중 입력값을 검사할 때
0
136
2
2-14.else,else if,switch 관련 질문입니다.
0
109
2
가위바위보 이미지(rsp.png)가 안보여요
0
264
3
Math.random() 에 9을 곱하는 이유
0
174
4
클로저 관련해서 질문있습니다.
1
188
2
유튜브 댓글 보고 왔습니다!- 퀴즈 중복된 숫자 검사 for 문
0
246
1
event.target.textContent관련 질문
0
273
2
객체 참조 관련 질문
0
179
1
-2+ -2 = -4 음수 더하기 음수 - 셀프체크 계산기
0
465
1
별찍기 마름모 문제입니다.
0
351
2
숙제 질문
0
217
1
5강 async/await으로 가독성 높이기에서
0
231
1
야구게임 관련 질문입니다
0
186
1
쿵쿵따, 계산기에서 변수 선언
0
181
1
지뢰 힌트 사라짐(대괄호)
0
167
1