Как сделать div видимым и не видимым

Question

Как сделать div видимым и невидимым после нажатия кнопки в MVC3.

Answer 1

Вы также можете проверить статус div, скрытый или видимый, и использовать ту же кнопку, чтобы показать или скрыть его.Кроме того, вы можете изменить заголовок кнопки соответственно:

        $('#button1').click(function() {
            if ($('#id1').is(':hidden')) {
                $('#id1').show();
                $('#button1').val('hide');
            } else {
                $('#id1').hide();
                $('#button1').val('show');
            }
        });

Answer 2

Asp.net-MVC использует jQuery по умолчанию, так что это версия jQuery:

$('#buttonId').click(function(){
     $('#divId').toggle();
});

Answer 3

Видимый / Невидимый и в то же время удаляющий пространство, которое элемент занимает на странице

$('#someid').toggle(); // to toggle between visible/invisible

или $('#someid').show(); и $('#someid').hide();

Если вы хотите сделать видимым/ invisible, но сохраняйте пространство, занимаемое элементом, затем используйте $('#someid').css({visibility:'hidden'}); и $('#someid').css({visibility:'visible'});

---

Но наиболее правильный способ в обоих случаях - создать класс css и добавить этот класс или удалить его изэлемент

правило CSS

.hidden{ display:none; }

и использование $('#someid').addClass('hidden') и $('#someid').removeClass('hidden')

Answer 4

Лучше сделать это на стороне клиента с Javasctipt

//to hide element
document.getElementById("MyElement").style.display = "none";
//to show element
document.getElementById("MyElement").style.display = "inline";
// where MyElement is id of your div