<%--兼容IE7 必须放在 head 的第一行--%>
独上高楼网站
  • javascript多线程的实现方法
  • 注：以下内容基于IE中GIF的onload事件的基础上，故所有测试IE only
    需要用到的几个图片
    先看一个简单的事实：

    < SCRIPT LANGUAGE="JavaScript">
    var img=new Image();
    img.src="attachment/1178365293_0.gif";
    img.onload=function()
    {
    alert("如要关闭请按住ESC键不放，并点击关闭按钮");
    }
    < /SCRIPT>

    如果不出所料的话你的IE应该弹出一大堆alert提示窗口了。注意是“一大堆”！
    原因很简单：IE对多帧GIF的onload事件重复执行，即每播放完一次动画，就重新执行一次onload事件。
    (注：按下ESC键会停止gif动画的播放，故也会停止onload事件执行)
    利用这一特性我们可以模拟多线程的实现：
    看下面的代码：

    image A onload执行次数：< span id="ThreadA">0< /span>< br>
    image B onload执行次数：< span id="ThreadB">0< /span>< br>
    image C onload执行次数：< span id="ThreadC">0< /span>
    < script>
    function Img(threadID,src)
    {
    var img = new Image;
    img.onload = function()
    {
    var c = parseInt(document.getElementById(threadID).innerHTML);
    document.getElementById(threadID).innerHTML=isNaN(c)1:++c;
    }
    img.src = src;
    return img;
    }
    var imgA = new Img("ThreadA","attachment/1178365293_0.gif");
    var imgB = new Img("ThreadB","attachment/1178365293_1.gif");
    var imgC = new Img("ThreadC","attachment/1178365293_2.gif");
    < /script>

    是不是有点意思了
    再看下面的代码：
    < script>
    //by Rimifon
    var Threads = new Array;
    onload = function()
    {
    for(var C=1;C< 501;C++)
    {
    Threads.push(new Thread(C));
    }
    }
    function Go(sender)
    {
    var IsStart = sender.value=="全部开始";
    for(var x in Threads)
    {
    Threads[x].Start = IsStart;
    }
    sender.value = "全部" + (IsStart"暂停":"开始");
    }
    function Thread(ID)
    {
    this.Start = 0;
    var cursor = this;
    var span = document.createElement("span");
    var counter = document.createTextNode("0");
    span.appendChild(counter);
    var div = document.createElement("div");
    div.appendChild(document.createTextNode("线程" + ID + "："));
    div.style.cursor = "pointer";
    div.onclick = function()
    {
    cursor.Start = !cursor.Start;
    }
    div.oncontextmenu = function()
    {
    img.onload = null;
    this.removeNode(true);
    return false;
    }
    div.appendChild(span);
    document.body.appendChild(div);
    var img = new Image;
    img.onload = function()
    {
    if(cursor.Start) counter.data = parseInt(counter.data) + 1;
    div.style.backgroundColor = cursor.Start"#abcdef":"yellow";
    }
    img.src = "images/51js.gif";
    }
    < /script>
    < input type=button value="全部开始" onclick="Go(this)">
    < input type=button value="弹出对话框" onclick="alert('对话框测试')">
    部分代码引自Rimifon。(转载 http://Dnew.cn)
  • 与本文主题相关的文章