[Javascript] 버튼에 강제 클릭 발생 시키기

 

버튼에 강제 클릭 이벤트 발생 시키기 (click())

<input type='text' onkeyup='handleInputOnkeyup()' />
<input 
  id='my_btn'
  type='button' 
  value='확인'
  onclick='handleButtonOnclick()' />

function handleInputOnkeyup()  {
  document.getElementById('my_btn').click();
}

function handleButtonOnclick()  {
  alert('버튼이 클릭되었습니다!!');
}

 

 

위 예제는 사용자가 input 창에 키보드로 값을 입력했을 때

강제로 '확인'버튼의 이벤트를 발생시키는 예제입니다.

조금 이상하지만, 특정 이벤트가 발생했을 때 버튼을 강제로 클릭시키는 것을 보여주기 위해 이렇게 만들었습니다.

 

 먼저 '확인' 버튼을 눌러보세요. 

'확인' 버튼을 클릭하면, '버튼이 클릭되었습니다!!' 라는 alert 창이 뜹니다.

 

 input 창에 키보드로 아무거나 타이핑을 해보세요. 

input 창에 onkeyup 이벤트가 발생하면 'handleInputOnkeyup()' 함수를 호출하고,

이 함수는

'document.getElementById('my_btn')'

'확인' 버튼 element를 선택하고,

'document.getElementById('my_btn').click()'

'확인' 버튼 element에서 click() 함수를 호출하여 강제로 버튼을 클릭한 효과를 줍니다.