반응형
단순한 함수의 경우에는 바로 클릭 이벤트에 바로 함수명을 넣으면 적용이 되었다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1 id='test'>Click Me</h1>
<script
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script type="text/javascript">
$('#test').on('click', test1);
function test1() {
alert("Hello world!");
}
</script>
</body>
</html>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter
|
위와 같이 입력하면
다음과 같이 잘 나온다. 하지만 만약 함수에 파라미터가 있다면 어떻게 될까?
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1 id='test'>Click Me</h1>
<script
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script type="text/javascript">
$('#test').on('click', test2("Hello Web!"));
function test1() {
alert("Hello world!");
}
function test2(parameter) {
alert(parameter);
}
</script>
</body>
</html>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter
|
다음과 같이 입력하면 클릭을 하지도 않았는데 Hello Web! 이 출력되고 만다.
|
1
2
3
4
5
6
7
8
9
10
11
|
<script type="text/javascript">
$('#test').on('click', function() {
test2("Hello Web!")
});
function test2(parameter) {
alert(parameter);
}
</script>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter
|
이런 식으로 function() { 함수명(파라미터) } 를 하면 정상적으로 클릭에 맞춰 이벤트가 발생된다.
반응형
'Web > Jquery' 카테고리의 다른 글
| [Web] html 파일에 Jquery 설치, 사용하기 (0) | 2019.06.30 |
|---|
