'웹 개발/Problems'에 해당되는 글 9건

  1. 2021.03.19 버튼에 onClick함수 붙이기

버튼에 onClick함수 붙이기

웹 개발/Problems 2021. 3. 19. 11:36

app이라는 객체안에 function onClickButton()이 있다고 가정하자.

let button = document.querySelector('#buttonSubmit');

let app = {
	init:()=>{
    	button.onclick = app.onClickButton
	}
	onClickButton: ()=>{
    	console.log('button clicked');
	}
}
app.init()

이렇게 코딩을 한다면 app.init()을 통해 button.onclick에 정상적으로 함수가 붙을거 같지마 결과는 그렇지 않았다.

따라서 

let button = document.querySelector('#buttonSubmit');

let app = {
	init:()=>{
    	button.onclick = onClickButton()
	}
	foo: ()=>{
    	console.log('button clicked');
	}
}
function onClickButon(){
	app.foo()
}
app.init()

이런식으로 app객체의 밖에 따로 함수를 만들어서 붙여주니까 해결이 되었다.

: