<html>
<head>
</head>
<body>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$('body').on('click','a, li', function(event){
console.log(this.tagName);
})
</script>
<ul>
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
<li><a href="#">JavaScript</a></li>
</ul>
</body>
</html>
이렇게 쓰면 추후에 추가되는 것들에도 함수를 넘길 수 있다
<html>
<head>
</head>
<body>
<input type="text" id="target" />
<p id="status"></p>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$('#target').on('focus blur', function(e){
$('#status').html(e.type);
})
</script>
</body>
</html>
ㅇ이렇게 하면 포커스와 블러를 설정할수 있다 신기하다
<html>
<head>
</head>
<body>
<input type="text" id="target"></textarea>
<input id="remove" type="button" value="remove" />
<p id="status"></p>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
var handler = function(e){
$('#status').text(e.type+Math.random());
};
$('#target').on('focus blur', handler)
$('#remove').on('click' , function(e){
$('#target').off('focus blur', handler);
console.log(32);
})
</script>
</body>
</html>
ㅇ이해못햇음
'HTML 참고서 > HTML 생활코딩 Youtube' 카테고리의 다른 글
정리 x 공부중 (0) | 2020.08.19 |
---|---|
25.JavaScript Form event (0) | 2020.04.17 |
24.JavaScript load event (0) | 2020.04.17 |
23.JavaScript event 3 (0) | 2020.04.17 |
22.JavaScript event 2 (0) | 2020.04.17 |