15赞

隐藏整个表会调整它的大小

作者：手机用户2502851955 | 2023-08-30 15:44

如何解决《隐藏整个表会调整它的大小》经验，为你挑选了1个好方法。

有一个带有简单表格的HTML页面和要显示/隐藏的js代码:



    title
    





[click]







    s
    d
    a

会发生什么事情是在Mozilla上,在您单击两次后(即使使用table-layout:fixed css),表格也会调整大小.IE运行正常.

1> cletus..：

表不应设置为display: block.表行和单元格也不应该.它们具有不同的显示值.我的建议？不要这样做.使用课程:

.hidden {
  display: none;
}

并动态添加它并从表中删除它,以避免在您显示的元素上设置正确的显示类型的问题.

编辑:澄清关于为什么这样做以及发生了什么的评论.试试这个:

Cell 1

Cell 2

它会(或应该)搞砸你的桌面布局.为什么因为默认情况下元素display: table-cell没有block.表格是一样的.他们有display: table.

取消设置CSS属性是有问题的.

因此,您最好使用类来设置和取消设置属性.它更容易更改(该类驻留在CSS文件中而不是代码),避免了将值设置回正确的原始值等问题,并且通常提供更清晰的解决方案,尤其是在与jQuery等库一起使用时.在jQuery中,您可以:

$("table").toggleClass("hidden");

完成.

或者你可以使用addClass(),removeClass()如果这更合适.例如:

... ...

和

$(function() {
  $("#hide").click(function() {
    if ($("#mytable").is(".hidden")) {
      $("#hide").val("Hide Table");
      $("#mytable").removeClass("hidden");
    } else {
      $("#hide").val("Show Table");
      $("#mytable").addClass("hidden");
    }
  });
});

而且你有一个健壮,简洁和易于理解的解决方案(一旦你了解jQuery语法,这不需要那么长时间).

用Javascript直接搞乱是2002年.:-)

推荐阅读

程序员
Thread.Sleep(2500)vs. Task.Delay(2500).Wait()

如何解决《Thread.Sleep(2500)vs.Task.Delay(2500).Wait()》经验，为你挑选了2个好方法。 ... [详细]
程序员
C#代码在Unity中不起作用

如何解决《C#代码在Unity中不起作用》经验，为你挑选了1个好方法。 ... [详细]
程序员
在Swift中的UIPopoverController上设置多个箭头方向

如何解决《在Swift中的UIPopoverController上设置多个箭头方向》经验，为你挑选了1个好方法。 ... [详细]
程序员
带有指示器和下一个/上一个按钮的Onsen-UI Carousel

如何解决《带有指示器和下一个/上一个按钮的Onsen-UICarousel》经验，为你挑选了1个好方法。 ... [详细]
程序员
Python:它不允许我使用Tkinter root = Tk()错误

如何解决《Python:它不允许我使用Tkinterroot=Tk()错误》经验，为你挑选了1个好方法。 ... [详细]
程序员
对数组进行排序,以便第一个和最后一个元素形成"对"

如何解决《对数组进行排序,以便第一个和最后一个元素形成"对"》经验，为你挑选了1个好方法。 ... [详细]
程序员
jsfiddle中没有框架部分

如何解决《jsfiddle中没有框架部分》经验，为你挑选了1个好方法。 ... [详细]
程序员
在Python 3中安装和运行模块（入门）

如何解决《在Python3中安装和运行模块（入门）》经验，为你挑选了1个好方法。 ... [详细]
程序员
多列表理解

如何解决《多列表理解》经验，为你挑选了1个好方法。 ... [详细]
程序员
如何获取字符串中组的所有排列？

如何解决《如何获取字符串中组的所有排列？》经验，为你挑选了1个好方法。 ... [详细]
程序员
浏览器支持Angular材质

如何解决《浏览器支持Angular材质》经验，为你挑选了2个好方法。 ... [详细]
程序员
在C#中的接口实现中使用继承的接口

如何解决《在C#中的接口实现中使用继承的接口》经验，为你挑选了1个好方法。 ... [详细]
程序员
打印任何STL容器

如何解决《打印任何STL容器》经验，为你挑选了2个好方法。 ... [详细]
程序员
当我需要总数时生成NAN

如何解决《当我需要总数时生成NAN》经验，为你挑选了1个好方法。 ... [详细]
程序员
响应式图像拉伸 - 基于y轴的网格？

如何解决《响应式图像拉伸-基于y轴的网格？》经验，为你挑选了0个好方法。 ... [详细]
程序员
显示分配堆栈跟踪时防止程序崩溃

如何解决《显示分配堆栈跟踪时防止程序崩溃》经验，为你挑选了1个好方法。 ... [详细]
程序员
斯坦福依赖解析器设置和NLTK

如何解决《斯坦福依赖解析器设置和NLTK》经验，为你挑选了1个好方法。 ... [详细]
程序员
SecCopyErrorMessageString在swift中给出"使用未解析的标识符"

如何解决《SecCopyErrorMessageString在swift中给出"使用未解析的标识符"》经验，为你挑选了1个好方法。 ... [详细]
程序员
为什么我还需要打开Swift字典值呢？

如何解决《为什么我还需要打开Swift字典值呢？》经验，为你挑选了1个好方法。 ... [详细]
程序员
ClassCastException Double to Float,即使我没有使用Double

如何解决《ClassCastExceptionDoubletoFloat,即使我没有使用Double》经验，为你挑选了1个好方法。 ... [详细]

手机用户2502851955

这个屌丝很懒，什么也没留下！

关注作者

Tags | 热门标签

RankList | 热门文章

DevBox开发工具箱 | 专业的在线开发工具网站