it-roy-ru.com

Как изменить css отображать нет или заблокировать свойство с помощью Jquery?

Как изменить css отображать нет или заблокировать свойство с помощью Jquery?

358
learner

Правильный способ сделать это - использовать show и hide:

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

Альтернативный способ - использовать метод jQuery css :

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

Есть несколько способов сделать это, каждый со своей целью.


1.) Чтобы использовать inline, просто присваивая элементу список действий

$('#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 

  • некоторые элементы отображаются как inline, inline-block или table, в зависимости от Tag Name

$ ( '# Ele_id') переключения ().

98
SpYk3HH

Если отображение div по умолчанию является блочным, вы можете просто использовать .show() и .hide() или, что еще проще, .toggle() для переключения между видимостью.

27
reko_t

Простой способ:

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

)}
5
user3726824

для скрытия:

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

для видимости:

$("#id").css("display", "");
5
Phanikumar Jatavallabhula

Другой способ сделать это с помощью метода jQuery CSS:

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

Если вы хотите скрыть и показать элемент в зависимости от того, виден ли он уже или нет, вы можете использовать вместо него переключатель: of .hide () и .show ()

$ ( 'Эль') переключение ().

1
Peter verleg
(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);
1
Pham

В моем случае я делал показывать/скрывать элементы формы в зависимости от того, был ли элемент ввода пустым или нет, поэтому, когда скрывались элементы, элемент, следующий за скрытыми, был перемещен, занимая его пространство, было необходимо сделать float: left элемента такого элемента. Даже используя плагин в зависимости от того, нужно было использовать float.

0
user2341112

.hide () не работает в Chrome для меня Это работает для скрытия:

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

использовать этот 

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

или же 

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