"자바스크립트 onclick 이벤트"의 두 판 사이의 차이

잔글 (봇: 자동으로 텍스트 교체 (-</source> +</syntaxhighlight>, -<source +<syntaxhighlight ))
6번째 줄: 6번째 줄:


==예시1: input button==
==예시1: input button==
<source lang='html5'>
<syntaxhighlight lang='html5'>
<input type="button" id="button1" onclick="button1_click();" value="버튼1" />
<input type="button" id="button1" onclick="button1_click();" value="버튼1" />
<script>
<script>
13번째 줄: 13번째 줄:
}
}
</script>
</script>
</source>
</syntaxhighlight>
<jsfiddle>zmLqsLk4</jsfiddle>
<jsfiddle>zmLqsLk4</jsfiddle>


==예시2: button==
==예시2: button==
<source lang='html5'>
<syntaxhighlight lang='html5'>
<button id="button1" onclick="button1_click();">버튼1</button>
<button id="button1" onclick="button1_click();">버튼1</button>
<script>
<script>
24번째 줄: 24번째 줄:
}
}
</script>
</script>
</source>
</syntaxhighlight>
<jsfiddle>8o1yg8u2</jsfiddle>
<jsfiddle>8o1yg8u2</jsfiddle>


* 인수 전달
* 인수 전달
<source lang='html5'>
<syntaxhighlight lang='html5'>
<button id="button1" onclick="button1_click('hello');">버튼1</button>
<button id="button1" onclick="button1_click('hello');">버튼1</button>
<script>
<script>
34번째 줄: 34번째 줄:
alert( s + " 버튼을 누르셨습니다.");
alert( s + " 버튼을 누르셨습니다.");
}
}
</source>
</syntaxhighlight>


==같이 보기==
==같이 보기==

2020년 11월 2일 (월) 02:51 판

1 개요

onclick Event
onclick 이벤트
  • 클릭시 발생하는 이벤트
  • 클릭시 자바스크립트 수행

2 예시1: input button

<input type="button" id="button1" onclick="button1_click();" value="버튼1" />
<script>
function button1_click() {
	alert("버튼1을 누르셨습니다.");
}
</script>

3 예시2: button

<button id="button1" onclick="button1_click();">버튼1</button>
<script>
function button1_click() {
	alert("버튼1을 누르셨습니다.");
}
</script>
  • 인수 전달
<button id="button1" onclick="button1_click('hello');">버튼1</button>
<script>
function button1_click(s) {
	alert( s + " 버튼을 누르셨습니다.");
}

4 같이 보기

5 참고

문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}