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

잔글 ("자바스크립트 onclick 이벤트" 문서를 보호했습니다 ([편집=자동 인증된 사용자만 허용] (무기한) [이동=자동 인증된 사용자만 허용] (무기한)))
 
(사용자 3명의 중간 판 8개는 보이지 않습니다)
10번째 줄: 10번째 줄:
<script>
<script>
function button1_click() {
function button1_click() {
alert("버튼1을 누르셨습니다.");
console.log("버튼1을 누르셨습니다.");
}
}
</script>
</script>
16번째 줄: 16번째 줄:


==예시2: button==
==예시2: button==
<syntaxhighlight lang='html5'>
<syntaxhighlight lang='html5' run>
<button id="button1" onclick="button1_click();">버튼1</button>
<button id="button1" onclick="button1_click();">버튼1</button>
<script>
<script>
function button1_click() {
function button1_click() {
alert("버튼1을 누르셨습니다.");
console.log("버튼1을 누르셨습니다.");
}
}
</script>
</script>
</syntaxhighlight>
</syntaxhighlight>
<jsfiddle>8o1yg8u2</jsfiddle>


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



2022년 11월 13일 (일) 16:41 기준 최신판

1 개요

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

2 예시1: input button

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

3 예시2: button

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

4 같이 보기

5 참고

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