Programming

Jquery를 사용하여 CSS 표시 없음을 변경하거나 속성을 차단하는 방법은 무엇입니까?

procodes 2020. 2. 22. 11:59
반응형

Jquery를 사용하여 CSS 표시 없음을 변경하거나 속성을 차단하는 방법은 무엇입니까?


Jquery를 사용하여 CSS 표시 없음을 변경하거나 속성을 차단하는 방법은 무엇입니까?


이 작업을 수행하는 올바른 방법은 사용하는 것입니다 showhide:

$('#id').hide();
$('#id').show();

다른 방법은 jQuery CSS 메소드 를 사용하는 것입니다.

$("#id").css("display", "none");
$("#id").css("display", "block");

이를 위해 여러 가지 방법이 있으며 각각 고유 한 목적으로 사용됩니다.


1. ) 요소에 할 일 목록을 지정하는 동안 인라인 을 사용하려면

$('#ele_id').css('display', 'block').animate(....
$('#ele_id').css('display', 'none').animate(....

2. ) 여러 CSS 속성을 설정하는 동안 사용하려면

$('#ele_id').css({
    display: 'none'
    height: 100px,
    width: 100px
});
$('#ele_id').css({
    display: 'block'
    height: 100px,
    width: 100px
});

3. ) 명령을 동적으로 호출하려면

$('#ele_id').show();
$('#ele_id').hide();

4. ) div 인 경우 블록과 없음을 동적으로 전환하려면

  • 몇몇 요소들은에 따라 인라인, 인라인 블록 또는 테이블로 표시되는 타행 g의 N AME

$ ( '# ele_id'). toggle ();


div의 표시가 기본적으로 차단되어 있으면 .show()and을 사용 .hide()하거나 더 간단하게 .toggle()가시성을 전환 할 수 있습니다.


숨기기 :

$("#id").css("display", "none");

쇼 :

$("#id").css("display", "");

jQuery CSS 메소드를 사용하는 다른 방법 :

$("#id").css({display: "none"});
$("#id").css({display: "block"});

간단한 방법 :

function displayChange(){
$(content_id).click(function(){
  $(elem_id).toggle();}

)}

경우 숨기려는이를 이미 표시되는지 여부에 따라 요소를 표시하거나하지 대신 토글 사용할 수의 .hide().show()

$('elem').toggle();

(function($){
    $.fn.displayChange = function(fn){
        $this = $(this);
        var state = {};
        state.old = $this.css('display');
        var intervalID = setInterval(function(){
            if( $this.css('display') != state.old ){
                state.change = $this.css('display');
                fn(state);
                state.old = $this.css('display');
            }
        }, 100);        
    }

    $(function(){
        var tag = $('#content');
        tag.displayChange(function(obj){
            console.log(obj);
        });  
    })   
})(jQuery);

Chrome에서 .hide ()가 작동하지 않습니다.

var pctDOM = jQuery("#vr-preview-progress-content")[0];
pctDOM.hidden = true;

이것을 사용하십시오

$("#id").(":display").val("block");

또는

$("#id").(":display").val("none");

필자의 경우 입력 요소가 비어 있는지 여부에 따라 양식의 요소 표시 / 숨기기를 수행 했으므로 요소를 숨길 때 숨겨진 요소 뒤에 오는 요소가 공간을 차지하도록 재배치되었습니다 .float을 수행해야했습니다. 그런 요소의 요소. dependOn으로 플러그인을 사용하더라도 float을 사용해야했습니다.

참고 URL : https://stackoverflow.com/questions/3582619/how-to-change-css-display-none-or-block-property-using-jquery



반응형