討論區: 公開ディスカッション (Thread #17018)

onloadイベントの挙動について (2007-12-07 17:05 by noblesavage #33856)

お世話になっております、NobleSavageです。

onloadイベントについてです。
ボタン押下で発生するイベント「処理A」と「処理B」が
定義されているとします。
・処理Aは、何かしらの処理をした後に、処理Bを onclick() で呼び出します。
・処理Bは、Gridにデータを表示します。

画面上のボタン押下で「処理A」を実行すると、
「処理B」が呼び出されて実行されるのはOKなのですが、
onloadイベントで「処理A」を実行すると、「処理B」が呼び出されません。

alert()を入れて挙動を確認したところ、
1.onloadイベントで処理Aが呼び出された場合
2.処理Aのボタンを直接押下した場合
ともに、syoriA()が実行されていることが確認できるのですが、
1については、syoriA()の中の処理B = btnNew2.onclick() が
実行されないようです。
2については処理B = btnNew2.onclick() が実行されます。

画面で初期表示するために上述のような仕組みにしているのですが、
onloadイベントを扱う際には何か注意することがあるのでしょうか?
対策がございましたらご教示いただきたいと存じます。

以下、サンプルです。

■レイアウト定義XML(test2Layout.xml)
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE layoutDef SYSTEM "layoutDef.dtd">
<layoutDef>
<layout name="test1Layout">
<button name="btnNew1" top="30" left="40" title="処理A"></button>
<button name="btnNew2" top="60" left="40" title="処理B"></button>
<grid name="grdNew1" top="80" left="30" height="100" rang="10">
<gridHeader width="100" title="col1" type="string"></gridHeader>
<gridHeader width="100" title="col2" type="string"></gridHeader>
<gridHeader width="100" title="col3" type="string"></gridHeader>
<gridHeader width="100" title="col4" type="string"></gridHeader>
<gridHeader width="100" title="col5" type="string"></gridHeader>
<gridHeader width="100" title="col6" type="string"></gridHeader>
<gridHeader width="100" title="col7" type="string"></gridHeader>
</grid>
</layout>
</layoutDef>

■イベント定義XML(test1Layout_e.xml)
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE eventDef SYSTEM "eventDef.dtd">
<eventDef>
<event id="onload" start="" before="" after="" finish="syoriA" type="local" async="false"></event>
<component id="btnNew1">
<event id="onclick" start="" before="" after="" finish="syoriA" type="local" async="true">
</event>
</component>
<component id="btnNew2">
<event id="onclick" start="startProcB" before="" after="" finish="finishProcB" type="remote" async="false" remoteUrl="xxxxx.do">
<result rootNode="resultList">
<target out="grdNew1" in="rows" inkey="row">
<bind tokey="0" node="n0"></bind>
<bind tokey="1" node="n1"></bind>
<bind tokey="2" node="n2"></bind>
<bind tokey="3" node="n3"></bind>
<bind tokey="4" node="n4"></bind>
<bind tokey="5" node="n5"></bind>
<bind tokey="6" node="n6"></bind>
</target>
</result>
</event>
</component>
</eventDef>

■イベント処理用のJavaScript
function syoriA() {
// 前処理をして...

alert('処理A:開始');

// 最後に処理Bを実行する
btnNew2.onclick();

alert('処理A:終了');
}

function startProcB() {
alert('処理B:開始');
}

function finishProcB() {
alert('処理B:終了');
}

以上、よろしくお願いいたします。

回覆 #33856×

You can not use Wiki syntax
You are not logged in. To discriminate your posts from the rest, you need to pick a nickname. (The uniqueness of nickname is not reserved. It is possible that someone else could use the exactly same nickname. If you want assurance of your identity, you are recommended to login before posting.) 登入

RE: onloadイベントの挙動について (2007-12-10 10:35 by yasumoto #33903)

マスカットのご利用ありがとうございます。

loadイベントに関しては、
描画が完全に完了する前にイベントを発生させてしまうと正常に動作しません。

10msecほどタイミングを遅らせて頂くと大丈夫かと思います。
(環境によって遅延させる時間は異なります。)


<対応後>
・load時にコールする関数を「tSyoriA」に変更。

-----
function tSyoriA(){
setTimeout(syoriA, 10);
}
-----

よろしくお願いいたします。
回覆: #33856

回覆 #33903×

You can not use Wiki syntax
You are not logged in. To discriminate your posts from the rest, you need to pick a nickname. (The uniqueness of nickname is not reserved. It is possible that someone else could use the exactly same nickname. If you want assurance of your identity, you are recommended to login before posting.) 登入