jQuery 이벤트 관련 지식 포인트-JS 튜토리얼-php.cn

jQuery 이벤트 관련 지식 포인트

jacklove

풀어 주다： 2018-05-08 11:39:30

원래의

1396명이 탐색했습니다.

jQuery는 js에서 특히 중요한 이벤트 처리를 위해 특별히 설계되었으므로 이 문서에서는 jQuery 이벤트에 대해 알아봅니다.

jQuery 이벤트 기능

jQuery 이벤트 처리 방법은 jQuery의 핵심 기능입니다.

이벤트 핸들러는 HTML에서 특정 이벤트가 발생할 때 호출되는 메서드를 참조합니다. 어떤 사건에 의해 "촉발된"(또는 "영감받은")이라는 용어가 자주 사용됩니다.

일반적으로 섹션의 이벤트 처리 메소드에 jQuery 코드를 넣습니다.

Example

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){  $("button").click(function(){
    $("p").hide();
  });});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button>Click me</button>
</body>
</html>

로그인 후 복사

직접 시도해 보세요

위의 예에서는 버튼의 클릭 이벤트가 호출됩니다. 트리거된 함수:

$("button").click(function() {..some code... } )

이 메서드는 모든

요소를 숨깁니다:

$("p"). hide ();

별도 파일의 기능

웹 사이트에 많은 페이지가 포함되어 있고 jQuery 기능을 쉽게 유지 관리하려면 jQuery 기능을 별도의 .js 파일에 넣으세요.

튜토리얼에서 jQuery를 시연할 때 섹션에 함수를 직접 추가합니다. 그러나 다음과 같이 별도의 파일에 넣는 것이 더 좋습니다(src 속성을 통해 파일 참조):

Example

<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="my_jquery_functions.js"></script>
</head>

로그인 후 복사

jQuery name conflict

jQuery는 $ 기호를 jQuery에 대한 소개방법으로 사용합니다. .

다른 JavaScript 라이브러리(예: Prototype)의 일부 함수도 $ 기호를 사용합니다.

jQuery는 이 문제를 해결하기 위해 noContribute()라는 메서드를 사용합니다.

var jq=jQuery.noConstrict()는 $ 기호 대신 고유한 이름(예: jq)을 사용하는 데 도움이 됩니다.

결론

jQuery는 HTML 이벤트를 처리하도록 특별히 설계되었으므로 다음 원칙을 따를 때 코드가 더 적절하고 유지 관리가 더 쉬워집니다.

모든 jQuery 코드를 이벤트 핸들러에 배치

Place 모든 이벤트 처리 기능은 문서 준비 이벤트 처리기

jQuery 코드를 별도의 .js 파일에 배치하세요.

이름 충돌이 있으면 jQuery 라이브러리 이름을 바꾸세요.

이 문서에서는 jquery 이벤트에 대한 관련 이해를 제공합니다. 더 많은 학습 자료를 보려면 주의하세요. PHP 중국어 웹사이트에 접속해 보세요.