$（document）.ready之前的事件

Question

我有一个功能可以在文档加载之前有条件地隐藏控件。如果我将此功能放在$(document).ready上，我会看到页面闪烁以有条件地隐藏控件。我想知道是否有一个事件可以在触发$(document).ready之前调用。

Answer 1

如前所述别人做这样的事情

<div id="test" class="hidden"> my hidden div tag </div> 

.hidden 
{ 
display:none; 
} 

文档中

。准备就绪后，就可以显示出，这是等价的onload，它等待直到HTML被加载在这里

$(document).ready(function() { 
    $('#test').show(); 
}); 

的jsfiddle例如

http://jsfiddle.net/kdpAr/

Answer 2

常见问题。使用CSS将控件默认隐藏，然后在$(document).ready上使用JS来决定使哪些控件可见。不会有闪烁。它看起来像是逐步加载页面的相应部分。

在文档准备就绪之前，您无法安全地运行JS，并且在运行JS之前文档的某些部分将可见。因此，唯一的解决方案是确保所有非闪烁元素默认隐藏，然后您只显示您想要看到的元素。

要做到这一点，只是把一个公共类上的所有动态元素的最简单方法：

<div id="myControl1" class="initiallyHidden"></div> 

，并使用CSS来确保他们都开始了隐患：

.initiallyHidden {display: none;} 

然后你的javascript会覆盖，当它决定一个元素应该是可见的：

document.getElementById("myControl1").style.display = "block"; 

Answer 3

当我需要隐藏着什么JavaScript是加载之前我把它藏在CSS像这样：

display:none; 

或：

visibility: hidden; 

您也可以结合使用条件下使用Javascript功能来揭示它，如果需要的话。

Answer 4

调用JavaScript函数在旁边的HTML元素

例如：

<span></span> 
<script> call JS function</script> 

Answer 5

你可以只打开HTML之后要condionnaly隐藏的脚本标记（jQuery的前必须申报然后直接调用hide，而不是在$（document）里面。像这样：

<div id="toHide">Lorem ipsum</div> 

<script type="text/javascript"> 
    $("#toHide").hide(); 
</script> 

Answer 6

你必须把你的元素之前运行你的JavaScript

<div>hi</div> 
<script> 
$("div").css('background-color', '#EEE'); 
</script> 

http://sandbox.phpcode.eu/g/d01a1