[JQUERY] 세트 가시성의 jQuery .hide ()의 등가 : 숨겨진

세트 가시성의 jQuery .hide ()의 등가 : 숨겨진

해결법

1. ---

   1.당신은 당신의 자신의 플러그인을 만들 수 있습니다.

   당신은 당신의 자신의 플러그인을 만들 수 있습니다.

   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';
       });
   };
   

   원래 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);
   

   jsFiddle.

2. ---

   2.거기에 내장 한 것이 아니라 당신은 당신의 자신의 아주 쉽게 작성할 수 있습니다 :

   거기에 내장 한 것이 아니라 당신은 당신의 자신의 아주 쉽게 작성할 수 있습니다 :

   (function($) {
       $.fn.invisible = function() {
           return this.each(function() {
               $(this).css("visibility", "hidden");
           });
       };
       $.fn.visible = function() {
           return this.each(function() {
               $(this).css("visibility", "visible");
           });
       };
   }(jQuery));
   

   당신은 다음과 같이이를 호출 할 수 있습니다 :

   $("#someElem").invisible();
   $("#someOther").visible();
   

   다음은 작업 예입니다.

3. ---

   3.이 작업을 수행하는 더 간단한 방법은 jQuery의 toggleClass () 메소드를 사용하는 것입니다

   이 작업을 수행하는 더 간단한 방법은 jQuery의 toggleClass () 메소드를 사용하는 것입니다

   CSS

   .newClass{visibility: hidden}
   

   HTML

   <a href="#" class=trigger>Trigger Element </a>
   <div class="hidden_element">Some Content</div>
   

   JS

   $(document).ready(function(){
       $(".trigger").click(function(){
           $(".hidden_element").toggleClass("newClass");
       });
   });
   

4. ---

   4.당신은 단지 가시성 숨기기의 표준 기능이 필요한 경우 : 현재의 레이아웃을 유지하기 위해 숨겨진 당신은 태그의 CSS를 변경 숨기기의 콜백 기능을 사용할 수 있습니다. JQuery와의 숨기기 문서

   당신은 단지 가시성 숨기기의 표준 기능이 필요한 경우 : 현재의 레이아웃을 유지하기 위해 숨겨진 당신은 태그의 CSS를 변경 숨기기의 콜백 기능을 사용할 수 있습니다. JQuery와의 숨기기 문서

   예 :

   $('#subs_selection_box').fadeOut('slow', function() {
         $(this).css({"visibility":"hidden"});
         $(this).css({"display":"block"});
   });
   

   이 사업부를 숨기기 위해 정상 멋진 애니메이션을 사용하지만 애니메이션 완료 후에는 블록에 숨겨진 디스플레이 가시성을 설정합니다.

   예 : http://jsfiddle.net/bTkKG/1/

   나는 CSS () 솔루션입니다. 당신이 $ ( "# 금주 모임")를 원하는 didnt가 알고 있지만 그것이 경우 애니메이션을 잃게에만 CSS () 메소드를 사용하기 때문에 당신은 지정하지 않았습니다.

5. ---

   5.여기에 $ .prop (이름 [, 값]) 또는 $ .attr (이름 [가치]) 함수처럼 작동 어떤 하나의 구현입니다. B 변수가 작성되어있는 경우, 시야가 그렇지 않으면 공개 리턴 값, 즉에 따라 설정되고,이 (다른 속성을 계속할 수 있도록)이 반환된다.

   여기에 $ .prop (이름 [, 값]) 또는 $ .attr (이름 [가치]) 함수처럼 작동 어떤 하나의 구현입니다. B 변수가 작성되어있는 경우, 시야가 그렇지 않으면 공개 리턴 값, 즉에 따라 설정되고,이 (다른 속성을 계속할 수 있도록)이 반환된다.

   jQuery.fn.visible = function (b) {
       if(b === undefined)
           return this.css('visibility')=="visible";
       else {
           this.css('visibility', b? 'visible' : 'hidden');
           return this;
       }
   }
   

   예:

   $("#result").visible(true).on('click',someFunction);
   if($("#result").visible())
       do_something;
   

6. ---

   6.jQuery를 숨기기위한 순수 JS 동등한 () / 쇼 () :

   jQuery를 숨기기위한 순수 JS 동등한 () / 쇼 () :

   function hide(el) {
       el.style.visibility = 'hidden';    
       return el;
   }
   
   function show(el) {
       el.style.visibility = 'visible';    
       return el;
   }
   
   hide(document.querySelector(".test"));
   // hide($('.test')[0])   // usage with jQuery
   

   우리는 유창 인터페이스 "디자인 패턴"을 만족 인해 엘을 돌려 사용합니다.

   여기에 예를 노력하고 있습니다.

   나는 또한 아마 더 그러나 대답은 "질문에 가까운"입니다 높게 권장되지 대안을 제공 아래 :

   HTMLElement.prototype.hide = function() {
       this.style.visibility = 'hidden';  
       return this;
   }
   
   HTMLElement.prototype.show = function() {
       this.style.visibility = 'visible';  
       return this;
   }
   
   document.querySelector(".test1").hide();
   // $('.test1')[0].hide();   // usage with jQuery
   

   우리가 여기에 순수 JS를 사용하기 때문에 물론 이것은 (@JamesAllardice 대답에 주어진) jQuery를 '각'을 구현하지.

   예를 들어 작업 여기에있다.

from https://stackoverflow.com/questions/9614622/equivalent-of-jquery-hide-to-set-visibility-hidden by cc-by-sa and MIT license