Question

div“intro”的javascript最后正在加载。由于网页首先加载bg图像然后加载java脚本，因此加载时间过长。有没有办法我可以在“介绍”div中显示“loading please wait”消息，直到它完全加载。我只是想要首先加载介绍。

Javascript代码：

var tl = new Array(
    "=======================",
    " Welcome user, ",
    " ###########################################"
);
var speed = 50;
var index = 0;
text_pos = 0;
var str_length = tl[0].length;
var contents, row;

function type_text() {
    contents = '';
    row = Math.max(0, index - 20);
    while (row < index)
    contents += tl[row++] + '\r\n';
    document.forms[0].elements[0].value = contents + tl[index].substring(0, text_pos) + "_";
    if (text_pos++ == str_length) {
        text_pos = 0;
        index++;
        if (index != tl.length) {
            str_length = tl[index].length;
            setTimeout("type_text()", 500);
        }
    }
    else setTimeout("type_text()", speed);
}

这是脚本，它基本上在div“intro”的文本区域中逐个打字。问题是它在加载整个页面时最后加载。它开始打印文本大约15秒左右。

Answer 1

您可以在domready上收听“document”事件，但似乎是not cross-browser。

例如：Mozilla

   document.addEventListener("DOMContentLoaded", methodName, false)

更好的选择是使用jQuery的.ready()事件。它们处理所有跨浏览器的实现。

例如：

$(document).ready(function(){
   //execute code here
});

//Shorthand
$(function(){
 //...
});

有关domready的更多信息，请参阅此related question。

Answer 2

您可以通过将内容包装在div标签中，然后使用另一个包含加载图像的div来使用jquery，这样就可以了：

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

    $('#divShowMeLater').load(function () {
        $('#loading').hide();
        $('#divShowMeLater').show();
    });
})

假设divShowMeLater是包含所有正在加载的内容的div。标记看起来与此类似：

<div id="divShowMeLater" style="margin-left:auto;margin-right:auto;text-align:center;" >
    <div id="loading">Page loading...
        <img src="images/ajax-loader.gif" alt="loading page..." />
    </div>
</div>

Answer 3

使用空的介绍div加载页面，使用“loading please wait”运行脚本，然后触发ajax请求以加载页面的其余部分并从ajax请求更新onComplete事件的页面

Answer 4

使用jQuery

   $(document).ready(function() {
      // update div here 
    });

http://api.jquery.com/ready/

或者你可以用

做到这一点

window.onload= (function() {
  // update div here        
};

加载Javascript需要很长时间

4 个答案: