jquery를 사용하여 모두 선택 및 모든 기능 선택 취소를 구현하는 방법

jquery를 사용하여 모두 선택 및 선택 취소 기능을 구현하는 방법: 먼저 jquery 라이브러리를 소개하고 jquery의 로딩 기능을 설정한 다음 ID를 기반으로 전체 선택 상자의 요소를 가져오고 클릭 이벤트를 all-select box; 마지막으로 클래스 속성 값이 checkOne인 다중 선택 상자를 얻습니다.

이 튜토리얼의 운영 환경: windows7 시스템, jquery3.2.1 버전, Dell G3 컴퓨터 이 방법은 모든 브랜드의 컴퓨터에 적합합니다.

추천: jquery 동영상 튜토리얼

jquery를 사용하여 모두 선택 및 모두 선택 해제 기능을 구현하는 방법:

1.html을 만든 다음 주로 body 태그에 아래와 같이 코드를 추가합니다. a 테이블에는 확인란이 포함되어 있습니다.

2. 그러면 가장 먼저 jquery 라이브러리를 소개하겠습니다. jquery 라이브러리 방식에 주의하세요. <script src="js/jquery-1.8.3.js"></script>는 <script src="js/jquery-1.8.3.js"></script>不能写成

<script src="js/jquery-1.8.3.js"></script>

이렇게 하세요. 그렇지 않으면 유효하지 않습니다! 둘 사이의 차이점을 시험해 볼 수 있습니다.

html5에는 type="text/javascript"

3을 추가할 필요가 없습니다. 그런 다음 jquery 로딩 기능이 jquery의 표준 구성입니다. 다음 방법은 상대적으로 축약됩니다.

4. 다음으로 ID를 기반으로 전체 선택 상자의 요소를 가져온 다음 클릭 이벤트를 전체 선택 상자에 바인딩합니다.

5. 클릭 이벤트 메소드에서 완료: 클래스 속성 값이 checkOne인 다중 선택 상자를 가져온 다음 prop(속성, 값) 메소드를 통해 selected 속성을 모두 선택/선택 취소 상자로 설정합니다. 체크한 대로.

6. 위의 단계를 통해 jquery를 사용하여 모두 선택 및 모두 선택 취소 기능 구현이 완료되었습니다. 이 HTML을 브라우저를 통해 실행하여 다음과 같은 효과를 확인합니다.

관련 학습 권장 사항: js 비디오 튜토리얼

🎜

위 내용은 jquery를 사용하여 모두 선택 및 모든 기능 선택 취소를 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!