javascript - 如何更改 jquery .toggle() 以使用显示 :table-cell?

Question

我正在使用 jquery .toggle() 在页面上显示一个 div，该页面在页面加载时显示为无。但是，在默认设置下，jquery 会插入 display:block，我希望在其中显示:table-cell。我怎样才能做到这一点？到目前为止我的尝试:

<div class="mydiv" style"display:none">test</div>

.mydiv {
display:table-cell;
}

$("a#showdiv").click(function() {
    $(".mydiv").toggle();

Answer 1

使用.toggleClass()而是使用 css 进行样式设置..

html

<div class="mydiv table-hidden">test</div>

CSS

.mydiv {
    display:table-cell;
}
.mydiv.table-hidden{
    display:none;
}

jquery

$("a#showdiv").click(function() {
    $(".mydiv").toggleClass('table-hidden');
}