Jquery가 이벤트를 수신할 수 있나요?
- 青灯夜游원래의
- 2022-04-28 14:02:272016검색
jquery는 이벤트를 수신할 수 있습니다. jquery는 다양한 이벤트 모니터링 방법을 제공합니다. 1. 클릭 이벤트를 모니터링하고 이벤트 처리 기능을 지정할 수 있는 click() 2. 변경 이벤트를 모니터링하고 이벤트 처리 기능을 지정할 수 있는 dblclick() 더블 클릭 이벤트를 모니터링할 수 있습니다. 4. hover() 등.
이 튜토리얼의 운영 환경: windows7 시스템, jquery1.10.2 버전, Dell G3 컴퓨터.
jquery는 이벤트를 수신할 수 있습니다.
jquery는 click(), on() 및 기타 메서드와 같이 이벤트를 수신하는 다양한 메서드를 제공합니다. 다음은 몇 가지 방법입니다.
1. click() 메소드:
click() 메소드는 클릭 이벤트가 발생할 때 실행될 함수를 지정합니다.
예:
요소를 클릭할 때 경고 텍스트
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("p").click(function() {
alert("段落被点击了。");
});
});
</script>
</head>
<body>
<p>点击这个段落。</p>
</body>
</html>
2.change() 메소드
change() 메소드는 변경 이벤트가 발생할 때 실행될 함수를 지정합니다.
예: 필드 변경 시 경고 텍스트
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function(){
$("input").change(function(){
alert("文本已被修改");
});
});
</script>
</head>
<body>
<input type="text">
<p>在输入框写一些东西，然后按下 enter 键或点击输入框外部。</p>
</body>
</html>
3.dblclick()
dblclick() 메서드는 더블 클릭 이벤트가 발생할 때 실행되는 함수를 지정합니다.
예:
요소를 두 번 클릭할 때 경고 텍스트
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("p").dblclick(function() {
alert("这个段落被双击。");
});
});
</script>
</head>
<body>
<p>双击这个段落。</p>
</body>
</html>
4. hover() 메소드
hover() 메소드는 마우스 포인터가 선택된 항목 위에 있을 때 실행할 두 가지 작업을 지정합니다. 요소 기능.
메소드는 mouseenter 및 mouseleave 이벤트를 트리거합니다.
예: 마우스 포인터를 위에 올리면
요소의 배경색 변경
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("p").hover(function() {
$("p").css("background-color", "yellow");
}, function() {
$("p").css("background-color", "pink");
});
});
</script>
</head>
<body>
<p>鼠标移动到该段落。</p>
</body>
</html>
이벤트를 듣는 다른 방법
| 메서드 | Description |
|---|---|
| bind() | 요소에 이벤트 핸들러 추가 |
| blur() | 초점 상실 이벤트 추가/트리거 |
| delegate() | 요소를 일치시키려면 추가하기 |
| die() | 의 현재 또는 미래 하위 요소에 대한 처리기가 버전 1.9에서 제거되었습니다. live() 메소드를 통해 추가된 모든 이벤트 핸들러를 제거하세요. |
| error() | 버전 1.8에서 더 이상 사용되지 않습니다. 오류 이벤트 추가/트리거 |
| focus() | 포커스 이벤트 추가/트리거 |
| focusin() | focusin 이벤트에 이벤트 핸들러 추가 |
| focusout() | focusout 이벤트에 이벤트 핸들러 추가 |
| keydown() | 추가/트리거 키 다운 이벤트 |
| keypress() | 추가/트리거 키 누르기 이벤트 |
| keyup() | 추가/트리거 키업 이벤트 |
| 버전 1.9에서 제거되었습니다. 현재 또는 미래에 선택된 요소에 하나 이상의 이벤트 핸들러를 추가하세요. | |
| 버전 1.8에서 더 이상 사용되지 않습니다. 로드 이벤트에 이벤트 핸들러 추가 | |
| mousedown 이벤트 추가/트리거 | |
| mouseenter 이벤트 추가/트리거 | |
| 마우스 추가/트리거 이벤트 나가기 | |
| mousemove 이벤트 추가/트리거 | |
| mouseout 이벤트 추가/트리거 | |
| mouseover 이벤트 추가/트리거 | |
| mouseup 이벤트 추가/트리거 | |
| on() 메소드를 통해 추가된 이벤트 핸들러 제거 | |
| 요소에 이벤트 핸들러 추가 | |
| Add 선택한 요소에 하나 이상의 이벤트 핸들러를 추가합니다. 이 핸들러는 요소당 한 번만 트리거될 수 있습니다 | |
| add/trigger resize event | |
| add/trigger 스크롤 이벤트 | |
| add/ 이벤트 선택 | |
| 제출 이벤트 추가/트리거 | |
| 선택한 요소에 바인딩된 모든 이벤트 트리거 | |
| 선택한 요소에 바인딩된 이벤트 트리거 요소 선택한 요소의 지정된 이벤트에 대한 모든 함수 | |
| 선택한 요소에서 추가된 이벤트 핸들러를 제거 | |
| 현재 또는 미래에 선택된 요소에서 제거 이벤트 핸들러 | |
| 는 버전 1.8에서 더 이상 사용되지 않습니다. 언로드 이벤트에 이벤트 핸들러 추가 | |
| 컨텍스트 메뉴 이벤트에 이벤트 핸들러 추가 |
위 내용은 Jquery가 이벤트를 수신할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!