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

51번째 줄: 51번째 줄:
<body>
<body>
<input type='button' id="button1" value='버튼1'/>
<input type='button' id="button1" value='버튼1'/>
<script>
<script type="text/javascript">
$("#button1").click(function() {
$("#button1").click(function() {
alert("버튼1을 누르셨습니다.");
alert("버튼1을 누르셨습니다.");
71번째 줄: 71번째 줄:
<body>
<body>
<button id="button1">버튼1</button>
<button id="button1">버튼1</button>
<script>
<script type="text/javascript">
$("#button1").click(function() {
$("#button1").click(function() {
alert("버튼1을 누르셨습니다.");
alert("버튼1을 누르셨습니다.");

2012년 4월 18일 (수) 22:58 판

1 자바스크립트

1.1 input button

<!DOCTYPE html>
<meta charset="utf-8" />
<head>
<title>onclick 예제 1</title>
</head>
<body>
<input type="button" id="button1" onclick="button1_click();" value="버튼1" />
<script type="text/javascript">
function button1_click() {
	alert("버튼1을 누르셨습니다.");
}
</script>
</body>
</html>

1.2 button

<!DOCTYPE html>
<meta charset="utf-8" />
<head>
<title>onclick 예제 1</title>
</head>
<body>
<button id="button1" onclick="button1_click();">버튼1</button>
<script type="text/javascript">
function button1_click() {
	alert("버튼1을 누르셨습니다.");
}
</script>
</body>
</html>

2 jQuery

2.1 input button

<!DOCTYPE html>
<meta charset="utf-8" />
<head>
<title>onclick 예제 1</title>
<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
</head>
<body>
<input type='button' id="button1" value='버튼1'/>
<script type="text/javascript">
$("#button1").click(function() {
	alert("버튼1을 누르셨습니다.");
});
</script>
</body>
</html>

2.2 button

<!DOCTYPE html>
<meta charset="utf-8" />
<head>
<title>onclick 예제 2</title>
<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
</head>
<body>
<button id="button1">버튼1</button>
<script type="text/javascript">
$("#button1").click(function() {
	alert("버튼1을 누르셨습니다.");
});
</script>
</body>
</html>

3 같이 보기

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