Question

我有一个jQuery，可以在点击时切换div。

$(document).ready(function() {
$('#showmenu').click(function() {
    $('#showmenu').text($('.sidebarmenu').is(':visible') ? 'Show Menu' : 'Hide Menu');
    $('.sidebarmenu').toggle("slide");
}); 
});

FIDDLE

如何在不使用

的情况下执行相同的操作

display:none;

...

Answer 1

查看基于偏移的解决方案

<button id="showmenu" type="button">Show menu</button></div>
<div class="sidebarmenu" style="position: absolute; left: -200000px">

    Can the button value change to "show" or "hide"
</div>

然后

$(document).ready(function() {
    $('#showmenu').click(function() {
        var hidden = $('.sidebarmenu').data('hidden');
        $('#showmenu').text(hidden ? 'Show Menu' : 'Hide Menu');
        if(hidden){
            $('.sidebarmenu').css({
                position: 'absolute',
                left: -200000
            })
        } else {
            $('.sidebarmenu').css({
                position: '',
                left: 0
            })
        }
        $('.sidebarmenu').data("hidden", !hidden);
    });
});

演示：Fiddle

Answer 2

您可以使用同样适用的visibility:hidden; css属性。

还有另一种选择，opacity设置opacity:0

Answer 3

不确定我是否收到你的问题..但我想你可以使用hide()。

 $('.sidebarmenu').hide();

在您的document.ready $(document).ready(function() {功能

中

fiddle here

Answer 4

您也可以使用.show()和.hide()

进行展示

($('#showmenu').is(':visible')) ? $('.sidebarmenu').show() 
                                : $('.sidebarmenu').hide();

在页面加载中隐藏div，如

$('.sidebarmenu').hide();

请参阅FIDDLE

Answer 5

要隐藏div，您可以使用Visible="false"并显示使用Visible="true"

Answer 6

$(document).ready(function() {
$('#showmenu').click(function() {
    $('#showmenu').text($('.sidebarmenu').is(':visible') ? 'Show Menu' : 'Hide Menu');
    $('.sidebarmenu').toggle("show");
}); 
});

隐藏div的其他方法

6 个答案: