文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在HTML元素加载到页面之前将其隐藏

问如何在HTML元素加载到页面之前将其隐藏
EN

Stack Overflow用户

提问于 2014-09-29 23:18:43

回答 3查看 9.3K关注 0票数 2

我有一个自定义的“新建”和“编辑”表单的SharePoint列表。我正在使用jQuery来隐藏$(document).ready()上的某些字段。

在页面加载时发生的情况是，在隐藏字段之前，您会看到所有显示的字段(瞬间)。看到这种闪光灯般的过渡有点令人不快。

在加载HTML元素之前，有没有办法处理它们的样式？(即: display:无)

示例代码：

$(document).ready() {
    // Hides fields 1 and 3 on page load
    // Users can see it being hidden in fraction of a second
    $('#field-1').hide();
    $('#field-3').hide();
}

javascript

jquery

sharepoint

回答 3

Stack Overflow用户

回答已采纳

发布于 2014-09-29 23:29:15

就我个人而言，我会使用普通的CSS来隐藏元素，并通过向body标记添加一个类来实现这一点。

<body class="initial-hide">
  ...
</body>

CSS看起来应该是这样的

body.initial-hide #element1, body.initial-hide #element2{
   display: none;
}

这样，要显示隐藏的元素，您需要做的就是从body - tag中删除类来显示元素：

$(document).ready() {
    $('body').removeClass('initial-hide');
}

而不是必须自己选择每个元素，而是对它们调用.show()函数。

票数 11

Stack Overflow用户

发布于 2014-09-29 23:22:07

这是因为您的javascript只有在文档准备就绪时才会触发。使用Css而不是javascript来隐藏元素并将其加载到页面中

<style>
#field-1,#field-3{
   display : none;
}
</style>

票数 5

Stack Overflow用户

发布于 2014-09-29 23:22:14

如果您在元素上设置了style="display:none;“，那么稍后使用jquery时，您可以调用.show方法使它们出现。

票数 3

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/26103264

复制

相似问题

问如何在HTML元素加载到页面之前将其隐藏
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在HTML元素加载到页面之前将其隐藏EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在HTML元素加载到页面之前将其隐藏
EN