2

div "intro" 的 javascript 终于加载了。由于网页先加载bg图像然后加载java脚本，因此加载时间太长。有没有办法我可以在“介绍”div中显示“正在加载请稍候”消息，直到它完全加载。我只想先加载介绍。

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 秒后开始打印文本。

4

4 回答 4

2

domready您可以在 上收听“ ”事件，document但似乎不是跨浏览器。

例如：Mozilla

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

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

例如：

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

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

有关更多信息，请参阅此相关问题domready。

于 2012-08-28T19:23:40.140 回答
0

您可以为此使用 jquery，方法是将内容包装在一个 div 标签中，然后是另一个包含加载图像的 div，效果如下：

$(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>
于 2012-08-28T19:24:18.190 回答
0

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

于 2012-08-28T19:24:49.787 回答
0

使用 jQuery

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

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

或者你可以这样做

window.onload= (function() {
  // update div here        
};
于 2012-08-28T19:25:19.097 回答