- PR -

Jscriptによる繰り返し処理中の画面描画

1
投稿者投稿内容
喝食
会議室デビュー日: 2006/05/02
投稿数: 4
投稿日時: 2007-02-20 10:42
エクセルのセル値をテキストに吐き出すという単純なJscriptを書いています。
行数が多いので、処理経過を随時表示させようと思っているのですが
処理が終了するまで画面表示することができません。

イメージとしては
for(var i=0; i<10000; i++){
document.all.test.innerHTML =i;
}
のように、繰り返し処理の途中に、メッセージを表示させたいのですが
上記の場合だと、処理の最後「9999」しか表示されません。

何か方法がありましたら、ご教授願います。
mio
ぬし
会議室デビュー日: 2005/08/25
投稿数: 734
お住まい・勤務地: 神奈川県
投稿日時: 2007-02-20 10:56
JavaScriptは複数のスレッドが動くわけではないので、ひとつの関数が終わるまでは描画が発生しないと考えてください。
…で。
そういう場合はループではなく、setTimeoutを使って毎回強制的に実行を切ります。
setTimeoutで呼び出された関数内でカウントアップして、必要なら再度setTimeoutです。
喝食
会議室デビュー日: 2006/05/02
投稿数: 4
投稿日時: 2007-02-21 22:35
ご返答、有難うございます。
やはり関数が終わるまで描画できないのですね。

メイン関数から複数の処理関数が走るので
要所要所でメッセージを表示させたかったのですが
仕方ないので、ログに吐こうかと思います。

しかし、ログに吐くのであればJscirptである必要性はなかったか。
VBSのほうが情報多いし。
JscriptのほうがVBSよりも画面表示は柔軟なんですけどねぇ。
かつのり
ぬし
会議室デビュー日: 2004/03/18
投稿数: 2015
お住まい・勤務地: 札幌
投稿日時: 2007-02-21 23:00
コード:
<html>
<head>
<script>
var count = 0;
var max = 1000;
var per = 50;

function hoge(){
	for(var i = 0; i < per; i++){
		var row = piyo.insertRow(-1);
		var cell1 = row.insertCell(-1);
		var cell2 = row.insertCell(-1);
		var cell3 = row.insertCell(-1);
		cell1.appendChild(document.createTextNode("aaaaaa"));
		cell2.appendChild(document.createTextNode("aaaaaa"));
		cell3.appendChild(document.createTextNode("aaaaaa"));
	}
	count = count + per;
	if(count < max){
		window.setTimeout("hoge()", 0);
	}
	fuga.innerHTML = count + "件";
}
</script>
</head>
<body onload="hoge()">
<div id="fuga">
</div>
<table id="piyo">
</table>
</div>
</body>
</html>

興味があったので実装してみました。
setTimeoutやsetIntervalで制御が戻るので、
頻繁に戻してやるとこういう実装も可能になりますね。
1

スキルアップ／キャリアアップ（JOB@IT）