window.onloadを複数実行したいのです

こんにちは。

最近、サーバーを借りてホームページを作りはじめた初心者なのですが、どなかた教えて下さいm(_ _)m

↓formでselectを使ったプルダウンメニューを設置しました。

<select id="area" name="area" onchange="changeA();">
<option value="1">海</ottion>
<option value="2">山</option>
</select>

このプルダウンメニューを触ると、Javascriptの制御で、海の項目が選択されると海関連の情報が表示され、山の項目が選択されると山関連の情報が表示されるページを作りました。

↓Javascriptソース
function changeA(){
if(document.getElementById('area')){
id = document.getElementById('area').value;
if(id == '1'){
document.getElementById('sea1').style.display = "";
document.getElementById('sea2').style.display = "";
document.getElementById('mnt1').style.display = "none";
document.getElementById('mnt2').style.display = "none";
}else if(id == '2'){
document.getElementById('sea1').style.display = "none";
document.getElementById('sea2').style.display = "none";
document.getElementById('mnt1').style.display = "";
document.getElementById('mnt2').style.display = "";
}
}
}
window.onload = changeA;

という感じです。

このような制御のプルダウンメニューを同じページにもうひとつ配置したところ、ページをブラウザの更新ボタンで更新したりすると、関係ない項目などが表示されるようになってしまいました。

原因を調べるために検索をしてみたところ、window.onloadを2つ実行させるには特別なことが必要とのことでしたが、どうすればよいのかが全然わかりません。

どなたか教えてくれないでしょうか？
お願いします。

No.5 回答者： t_netbug 回答日時： 2009/10/29 18:23

function attach(obj,eve,func){

if(obj.attachEvent){
obj.attachEvent('on'+eve,func);
}else{
obj.addEventListener(eve,func,false);
}
}
attach(window,'load',function(){
alert(1);
});
attach(window,'load',function(){
alert(2);
});
attach(window,'load',function(){
alert(3);
});

No.4 回答者： babu_baboo 回答日時： 2009/08/08 12:06

/*@if (@_jscript) attachEvent ('on' + @else@*/ addEventListener (/*@end@*/

　'load', function (evt) {
　　/*@if (@_jscript) detachEvent ('on' + @else@*/ removeEventListener (/*@end@*/
　　　'load', arguments.callee, false);

　　func1.call(this, evt);
　　func2.call(this, evt);
　　//さいしょからここに。
　}, false);

/*@if (@_jscript) attachEvent ('on' + @else@*/ addEventListener (/*@end@*/
　'load', function (evt) {
　　/*@if (@_jscript) detachEvent ('on' + @else@*/ removeEventListener (/*@end@*/
　　　'load', arguments.callee, false);

　　func3.call(this, evt);
　　func4.call(this, evt);
　　
　}, false);

とか

No.3 回答者： t_netbug 回答日時： 2009/08/07 10:48

試しに書いてみたのですが、これでも動作しました。

window.onload = function(){
alert(1);
}
var _onload = window.onload;
window.onload = function(){
(_onload)?(_onload)():0;
alert(2);
}
IE7とforefox3で動作確認しました。

No.2 回答者： fujillin 回答日時： 2009/08/05 18:22

window.onload = changeA;

　　～～～
window.onload = changeB;
みたいにしているのでしょうか？


これだと上書きされてしまうので、うまくいきません。
手っ取り早くやるなら、1行にして
window.onload = function(){ changeA(); changeB(); }
みたいにして、連続して書けば、順に実行されます。

複数のファンクションをちゃんと並列登録したいのであれば、
「addEventListener」とか「attachEvent」あたりを調べてみましょう。

この回答への補足

早速に回答有難うございます。

>みたいにしているのでしょうか？
はい、その通りです。
このやり方だと上書きされてしまうのですよね。。
順に実行するやり方でも問題なければ応急処置としてソースを使わせて頂きたいと思います。

>「addEventListener」とか「attachEvent」あたりを調べてみましょう。
はい、まずは調べて勉強してみようと思います。
ただ、スグには理解できなそうです…ｗ

有難うございますm(_ _)m

補足日時：2009/08/05 21:30

No.1 回答者： gogo724275 回答日時： 2009/08/05 18:16

addEventListenerとattachEventで検索。

それが分からなかったら
function change()
{
changeA();
changeB();
}
window.onload = change;
とでもしておけばいい。

この回答への補足

早速の回答有難うございます。

>addEventListenerとattachEventで検索。
分かりました、スグに調べて勉強してみます。
お手数をお掛けします。

補足日時：2009/08/05 21:28