改变 style 实时更新问题

Question

function doSth() {
    var box = document.getElementById("myBox");    // 先显示内容框
    box.style.visibility = "visible";
    box.innerHTML = "正在加载中...<br />请稍候";
show()
}function show(){
 http.open("GET", URL, false);  // http 是 XMLHttpRequest 实例
    http.send(null);  // 这里要很久    if (http.status == '200') {
        box.innerHTL = http.responseText;
        return true;
    } else {
        box.innerHTML = "读取失败!";
        return false;
    }}
换一个试试

Answer 1

改成異步處理！window.setTimeout

Answer 2

给点迟延就行, 诡异function doSth() {
    var box = document.getElementById("myBox");    // 先显示内容框
box.innerHTML = "正在加载中...<br />请稍候";
    box.style.visibility = "visible";
   
   setTimeout(t, 1);
}
function t(){
var box = document.getElementById("myBox");
    http.open("GET", url, false);  // http 是 XMLHttpRequest 实例
    http.send(null);  // 这里要很久
if (http.status == 200) {
box.innerHTML = http.responseText;
return true;
} else {
box.innerHTML = "读取失败!";
return false;
}
}

Answer 3

你的写法并不标准，需要监视http的onreadystatechange事件，function doSth() {
    var box = document.getElementById("myBox");    // 先显示内容框
    box.style.visibility = "visible";
    box.innerHTML = "正在加载中...<br />请稍候";    http.open("GET", URL, false);  // http 是 XMLHttpRequest 实例
    http.send(null);  // 这里要很久
    
    http.onreadystatechange = function(){
      if(this.readyState == 4){ //readyState 是http发送状态
        if (http.status == '200') { //status是请求后服务器返回状态
            box.innerHTL = http.responseText;
            return true;
        } else {
            box.innerHTML = "读取失败!";
            return false;
        }
      }
    }
}

Answer 4

因为是同步
-----------------类似于 setTimeout(执行抓取,间隔) 这样的有效, 但是 doSth 就没办法返回抓取是否成功.
真个郁闷---------------这是给别人做的东东, 人家就要求得提供一个这样的函数给他调用, 又一定要有 "正在加载中.." 的提示.
NND

Answer 5

function doSth() { 
    var box = document.getElementById("myBox");     // 先显示内容框 
    box.style.visibility = "visible"; 
    box.innerHTML = "正在加载中... <br />请稍候"; 
setTimeout(show(),1000) 
} function show(){ 
http.open("GET", URL, false);  // http 是 XMLHttpRequest 实例 
    http.send(null);  // 这里要很久     if (http.status == '200') { 
        box.innerHTL = http.responseText; 
        return true; 
    } else { 
        box.innerHTML = "读取失败!"; 
        return false; 
    } } 
这样不行？

Answer 6

这样子效果可以出来
但是
setTimeout(show, 1000); 没办法得到 show() 的返回值.

Answer 7

可能没有注意到, 我上面 doSth 是要有返回值的, 返回抓取是否成功

Answer 8

function doSth() { 
    var box = document.getElementById("myBox");     // 先显示内容框 
    box.style.visibility = "visible"; 
    box.innerHTML = "正在加载中... <br />请稍候"; 
    setTimeout(
      function(){
         if(show()){
             alert('成功');
         }else{ alert('失败');}
      }
    ,1000);
} function show(){ 
   http.open("GET", URL, false);  // http 是 XMLHttpRequest 实例 
    http.send(null);  // 这里要很久     if (http.status == '200') { 
        box.innerHTL = http.responseText; 
        return true; 
    } else { 
        box.innerHTML = "读取失败!"; 
        return false; 
    }
} 

Answer 9

觉得没必要这么做, 直接写到 show()里就好...