> 웹 프론트엔드 > 프런트엔드 Q&A > jquery 버튼 숨기기

jquery 버튼 숨기기

王林
풀어 주다: 2023-05-19 12:25:08
원래의
827명이 탐색했습니다.

jquery는 다양한 편리한 작업 방법을 제공하여 일반 JavaScript 프로그래밍을 더 빠르고 간단하게 만드는 매우 인기 있는 JavaScript 라이브러리입니다. 이 기사에서는 jquery를 사용하여 버튼을 숨기는 방법을 소개합니다.

먼저 jquery를 사용하기 전에 HTML 페이지에 jquery 파일에 대한 참조를 추가해야 합니다. 다음 코드를 사용하여 jquery 파일을 페이지에 도입할 수 있습니다.

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
로그인 후 복사

다음으로 아래와 같이 HTML에 버튼 요소를 추가할 수 있습니다.

<button id="btnHide">隐藏按钮</button>
로그인 후 복사

그런 다음 JavaScript에서 jquery 선택기를 사용하여 버튼 요소를 선택하고 add 숨기기 작업은 다음과 같습니다.

// 选中id为btnHide的按钮元素
var $btnHide = $("#btnHide");

// 定义隐藏操作
$btnHide.hide();
로그인 후 복사

위 코드에서는 jquery의 숨겨진 메소드 hide()를 사용합니다. 이 메소드는 선택한 요소를 보이지 않게 하고 페이지에서 제거할 수 있습니다. 따라서 위 코드를 실행하면 버튼 요소가 숨겨지고 페이지에서 사라집니다.

버튼 요소를 다시 표시하려면 jquery의 표시 메소드 show()만 사용하면 됩니다. 코드는 다음과 같습니다.

// 选中id为btnHide的按钮元素
var $btnHide = $("#btnHide");

// 定义显示操作
$btnHide.show();
로그인 후 복사

jquery를 사용하여 요소를 숨기거나 표시할 때 다음을 변경할 수 있습니다. 해당 코드는 페이지가 로드된 후 이벤트에 배치하여 페이지의 모든 요소가 올바르게 로드되고 작동 가능한지 확인합니다. 다음은 전체 샘플 코드입니다.




    使用jquery隐藏一个按钮
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

<button id="btnHide">隐藏按钮</button> <script> // 等待页面加载完成后执行 $(function() { // 选中id为btnHide的按钮元素 var $btnHide = $("#btnHide"); // 定义隐藏操作 $btnHide.hide(); // 定义显示操作 // $btnHide.show(); }); </script>
로그인 후 복사

위 코드를 사용하면 페이지에서 버튼을 클릭하여 자신을 숨기는 작업을 구현할 수 있습니다. jquery는 실제 프로그래밍에서 필요에 따라 선택하고 사용할 수 있는 풍부한 작업 방법을 제공한다는 점을 강조할 필요가 있습니다.

위 내용은 jquery 버튼 숨기기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿