요소 크기에 영향을 주지 않고 jQuery의 `.hide()` 기능을 어떻게 얻을 수 있습니까?

가시성을 위한 jQuery의 .hide()에 대한 대안 찾기: Hidden

jQuery에서 개발자는 .hide() 및 .show()는 CSS 표시 속성을 없음으로 설정하여 요소 가시성을 조작합니다. 그러나 요소의 크기를 변경하지 않고 요소 가시성을 숨김으로 설정해야 하는 경우 .hide()와 같은 동등한 함수를 찾는 것이 어려울 수 있습니다.

사용자 정의 플러그인 개발

한 가지 접근 방식은 원하는 기능을 제공하는 사용자 정의 jQuery 플러그인을 만드는 것입니다. 다음 코드 샘플은 세 가지 플러그인 생성을 보여줍니다.

jQuery.fn.visible = function() {
    return this.css('visibility', 'visible');
};

jQuery.fn.invisible = function() {
    return this.css('visibility', 'hidden');
};

jQuery.fn.visibilityToggle = function() {
    return this.css('visibility', function(i, visibility) {
        return (visibility == 'visible') ? 'hidden' : 'visible';
    });
};

이러한 플러그인을 사용하면 확장된 visible(), visible() 및 visibleToggle() 함수를 활용하여 해당 플러그인을 수정하지 않고도 요소 가시성을 직접 제어할 수 있습니다. 물리적인 크기.

원래 jQuery 토글() 함수 오버로드

보다 친숙한 접근 방식을 선호하는 사람들은 가시성 토글을 처리하기 위해 기존 jQuery 토글() 함수를 오버로드하는 것이 가능합니다. 한 가지 방법은 다음과 같습니다.

!(function($) {
    var toggle = $.fn.toggle;
    $.fn.toggle = function() {
        var args = $.makeArray(arguments),
            lastArg = args.pop();

        if (lastArg == 'visibility') {
            return this.visibilityToggle();
        }

        return toggle.apply(this, arguments);
    };
})(jQuery);

그러나 이 접근 방식은 원래의 Toggle() 함수를 수정하므로 권장되지 않습니다.

궁극적으로 자체 플러그인을 생성할지 아니면 토글을 오버로드할지 선택합니다. () 함수를 사용하면 제공된 솔루션은 가시성 속성을 통해 요소 가시성을 수정하기 위해 jQuery의 .hide()와 동일한 기능을 제공합니다.

위 내용은 요소 크기에 영향을 주지 않고 jQuery의 `.hide()` 기능을 어떻게 얻을 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!