- ベストアンサー
カプセル化？について
このようなプログラムを書いたのですが、ボタンをクリックしてもalert2が実行されません何故でしょうか！！＞＜ どうかお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"> <head> <script type = 'text/javascript' charset = 'UTF-8' src = 'jslb_ajax.js'></script> <script type = 'text/javascript' charset = 'UTF-8' src = 'cookie.js'></script> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <script src="http://maps.google.com/maps?file=api&v=1&key=ABQIAAAAsm3eIraQIktrtviyd0JlXBTcyTBaKMmwi780-Sh78Ay3Pg36mBS27UkGZUGL-mR0X2zg4ieZWlneBA" type="text/javascript"></script> </head> <script type="text/javascript"> //<![CDATA[ function onLoad(){ var map = new GMap(document.getElementById("map")); map.addControl(new GScaleControl()); map.centerAndZoom(new GPoint(139.745449, 35.658715), 12); function _alert2(){ alert("koneko"); } onLoad.prototype.alert2 = _alert2; } function koneko(){ alert("fff"); obj.alert2(); } var obj = new onLoad(); //]]> </script> <body onLoad = "onLoad()"> <div id="map" style="width: 600px; height: 600px"></div> <input type = "button" value ="botan" onclick = "koneko()"> </body> </html>
- n187
- お礼率25% (7/28)
- JavaScript
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
>var obj = new onLoad();の時点で一回onLoadは実行される、そしてそれが終わると<body onLoad = "onLoad()">でまたonLoadが実行されると考えていいのでしょうか。 それでいいと思います。 確かめるには、var map～function _alert2() の間に alert("onLoad実行"); を入れてみるとわかると思います。 >ヘッダの部分は外部ファイルやタイトルバーの設定として、<script>の部分は一体いつ読み込まれるのでしょうか。 >まず、script(JavaScriptの部分）を読み込んでからBODYタグ内のフォームを表示するという事になるのでしょうか。 読込実行の順序としては、 head部分に書かれた外部スクリプトがその書かれている順序で読込・（実行される部分は）実行されます。 その時点では、body は、まだ構成されていません。 </html>まで読込、画面の構成が終わった時点で body onload が実行されます。 つまり、 var obj = new onLoad(); でonLoad()が呼び出されるタイミングでは、 var map = new GMap(document.getElementById("map")); の document.getElementById("map") は、null（まだない）です。
その他の回答 (2)
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
>koneko()の中にあるfffが呼び出されたのじゃないですよね？？ koneko()の中の alert("fff")が呼び出された後、 obj.alert2()による alert("koneko")が呼び出されました。 ウチでの試験の場合、 'jslb_ajax.js' 'cookie.js' 等の <script src="…"> の部分 及び var map;から mapに関する部分 は削除して試験しました。 （この質問で問題になっている部分（呼出ができるかどうか）ではありませんので） なので、それらの部分でエラーになっているのではないかと思われます。 Firefoxを利用になられているのだったら メニューのツール～Javascriptコンソールを起動しておく（起動しておいて実行する）ことをお勧めします。
補足
私もいらない部分を削除してみたらできました・・・。 これはカプセル化以前の質問なのですが、var obj = new onLoad();の時点で一回onLoadは実行される、そしてそれが終わると<body onLoad = "onLoad()">でまたonLoadが実行されると考えていいのでしょうか。 といいますか、ヘッダの部分は外部ファイルやタイトルバーの設定として、<script>の部分は一体いつ読み込まれるのでしょうか。 まず、script(JavaScriptの部分）を読み込んでからBODYタグ内のフォームを表示するという事になるのでしょうか。
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
koneko()からalert2()を呼び出すところは問題なく実行できました。 （IE6,Firefox) なので、別のところでエラーになってるんじゃないかと思います。
補足
koneko()の中にあるfffが呼び出されたのじゃないですよね？？ 私もFirefoxを使っているのですが何が問題なのでしょう・・・
関連するQ&A
- javascriptでgooglemapを表示させたいのですが、fir
javascriptでgooglemapを表示させたいのですが、firefoxで表示できず、空白になってしまいます。 IEでは問題なく表示できています。何が問題でしょうか。 html部分です。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" id="sixapart-standard"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script src="http://maps.google.com/maps?file=api&v=2&key=xxxxxx" type="text/javascript"></script> <script type="text/javascript" src="http://xxxxx.xxx/test.js"></script> </head> <body> <div id="map" style="width: 450px; height: 300px"></div> </body> </html> test.js部分です。 window.onload = function() { var map = null; var geocoder = null; if (GBrowserIsCompatible()) { map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(35.67431, 139.69082), 13); // GClientGeocoderを初期化 geocoder = new GClientGeocoder(); } if (geocoder) { geocoder.getLatLng( "東京都xx区xx", function(point) { if (!point) { alert(address + " not found"); } else { map.setCenter(point, 13); var marker = new GMarker(point); map.addOverlay(marker); marker.openInfoWindowHtml("ここが目的地です。"); } } ); } }
- ベストアンサー
- JavaScript
- googleMapのマーカーがうまく表示されません
googleMapを使って地図を表示させていますが、MarkerやopenInfoWindowといった関数の部分が上手く表示されません。具体的なスクリプトはこんな感じです。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Google Maps JavaScript API Example</title> <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAREfirLNOQkMPltS0MtM_aRT2vOvOMLA6ksVZJNRPEoKnAz-wSxSLgFyYzSPMTRAqy1S4fTvUnXKX-g" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(35.689488, 139.691706), 20); map.addControl(new GLargeMapControl()); map.centerAndZoom(new GPoint(35.689488, 139.691706), 20); //マーカー var marker=new GMarker(new GPoint(35.689488, 139.691706)); map.addOverlay(marker); //吹き出し var msg="ここです"; map.openInfoWindowHtml(map.getCenterLatLng(),msg); } } //]]> </script> </head> <body onload="load()" onunload="GUnload()"> <div id="map" style="width: 500px; height: 500px"></div> <script type="text/javascript"> </body> </html> どなたかご教授くださると助かります。 宜しくお願いいたします。
- ベストアンサー
- JavaScript
- JavaScriptを使ってWebページにメッセージを表示させる
html内に<div id="info"></div>と書き、それをjavascriptのプログラムから「こんにちは」というメッセージを表示させるようにしたいのですが、何度試しても製作途中の段階でdocument.getElementById(id) has no propertiesというエラーが出てしまいます。（←Firebugでエラーが検出されます） どこが間違っているのか教えていただけると助かります。 ================= HTML ================= <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja" dir="ltr"> <head> <meta http-equiv="content-script-type" content="text/javascript" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>map</title> <link rel="stylesheet" type="text/css" href="common/css/main.css" /> <script src="common/js/main.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div id="info"></div> </body> </html> ================= JavaScript ================= var map window.onload = function() { load(); } function _d(id, htmlTxt) { document.getElementById(id).innerHTML = htmlTxt; } _d("info","こんにちは");
- 締切済み
- JavaScript
- jqueryについて質問です。
jqueryについて質問です。 過去こちらにお世話になりまして、一つの質問を解決していただきました。 しかしまた、わかったつもりになっていただけのようでして、再度問題が出てしまいました。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS" /> <meta http-equiv="Content-Script-Type" content="text/css" /> <link rel="stylesheet" type="text/css" href="main.css"></link> <script type="text/javascript" src="accordian.pack.js" charset="UTF-8"></script> <script type="text/javascript" src="jquery-1.3.2.min.js" charset="UTF-8"></script> <script type="text/javascript" src="smartsticky.js" charset="UTF-8"></script> <script type="text/javascript"> jQuery.noConflict(); jQuery(document).ready(function(){ new Accordian('basic-accordian',5,'header_highlight'); }); </script> このように記述しましたが、どちらも作動しないという状態になってしまいました。 smartsticky.jsが、元々は<SCRIPT>内に書かれていたものを、まとめて外部に出したような感じだとは思うのですが、それに対しての対処が思いつきません。見ての通りjQuery.noConflict();を使っても見たのですが、まるで効果なしです・・・ accordian.pack.jsとsmartsticky.jsをバッティングさせずに上手く同時に動かす手段はありますでしょうか？ ちなみにこのページのscript自体はこの記事をのものです。 組み込みもこの記事を参考に行っています。 http://solidstate.jp/ContentsDisplay/floatingBox/script_147.html http://solidstate.jp/ContentsDisplay/accordion/script_130.html
- 締切済み
- JavaScript
- firefox+xhtml+javascript
お世話になっております。 divをweb上でドラッグできるスクリプトを組みました。 Opera9.6,IE6では動いているのですが、Firefoxでは、ある条件下でしか動きません。 ある条件とは、DOCTYPEの宣言がされていないことで、XHTMLにしようとDOCTYPEを宣言すると、動作しなくなってしまいます。 <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='ja'> <head> <meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /> <meta http-equiv='Content-Script-Type' content='text/javascript' /> <title>test</title> <script type='text/javascript' src='FILENAME.js'></script> -------- <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> を消せば動きます。 仮に、DOCTYPEをHTML4.1などにしても動きません。 クオートをシングルからダブルにしても同じです。 動かない状態でも、JS自体は読んで、onload関数の中は見に行っているようです（alertを埋め込んだらでたので） 可能性として、 外部ファイルのJSの書き方に問題があるのでしょうか？ それとも、HTML側に問題があるのでしょうか？ ソースを見なくても何か考えられることがあれば、教えてください。 よろしくお願いします。
- ベストアンサー
- JavaScript
- GoogleMapを複数表示させたい
GoogleMap を API で２つ表示させて、それぞれの地図にマーカーをひとつずつつけたいです。 マーカーをつけて吹き出すをだすまではできたのですが、 マップをもうひとつ増やすにはどのように記述すればよいでしょうか？ 現在のソースは以下です -------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <style type="text/css"> #Gmap{ width:500px; height:500px; } </style> <script src="http://maps.google.com/maps?file=api&v=2&key=http://maps.google.com/maps?file=api&v=2&key=" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { //地図を作成 var map = new GMap2(document.getElementById("Gmap")); map.setCenter(new GLatLng(35.675845,139.744763), 15); //マーカーを作成 var marker = new GMarker(new GLatLng(35.675845,139.744763)); //マーカーをクリックしたら、吹き出しの中に写真を表示する GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml("テキストが入ります"); }); //マーカーを地図上に配置 map.addOverlay(marker); //縮尺移動のコントロールを設置 map.addControl(new GLargeMapControl()); //地図衛星写真 切り替えボタンを表示 map.addControl(new GMapTypeControl()); //縮尺表示 map.addControl(new GScaleControl()); } } //]]> </script> </head> <body onload="load()" onunload="GUnload()"> <div id="Gmap"></div> </body> </html> -------------------------------------------------------- よろしくお願いいたします
- ベストアンサー
- その他（プログラミング・開発）
- GoogleMapAPIで初期位置の表示
<?php $DBaddress = "大阪市北区芝田" ; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Google Maps JavaScript API Example</title> <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAKeodYAh1Nwl_nAMXwxLMtBSC5B7_MxPtqlxCQwd0QI3Cuv7JOxTp8TCJGdhudgycU3vU3mjNTZ5vhQ" type="text/javascript" charset="utf-8"></script> </head> <body onload="initAddress()"> <div id="map" style="width:450px; height:400px"></div> <script type="text/javascript"> //<![CDATA[ var map = new GMap2(document.getElementById("map")); var geocoder = new GClientGeocoder(); function showAddress(address) { geocoder.getLatLng( address, showTheLatLng ); } function showTheLatLng (latlng) { var address = document.getElementById("address").value; // 入力欄のidはaddress if (!latlng) { alert("ご指定の住所（" + address + "）はジオコーディングできませんでした。"); } else { map.setCenter(latlng, 13); map.addControl(new GLargeMapControl()); map.addControl(new GMapTypeControl()); var marker = new GMarker(latlng); map.addOverlay(marker); marker.openInfoWindowHtml(address); } } //]]> </script> </body> </html> としてDBから値を受け取って初期の地図を表示したいです。 どのようにしたら良いでしょうか？
- ベストアンサー
- JavaScript
- GoogleAPIの地図をPHP（Smarty）で表示させたい
PHPのSmartyを用いて、任意の住所の地図表示を行うテンプレートを作成しています。他の方が作られたサンプルプログラムを元に考えているのですが、地図が表示されないようです。 Smartyテンプレートとして、住所文字列を$event_locationとして格納し、その地図を表示させたいのですが、下記の2つのfunction部分で処理がとまるように見えています。 申し訳ございませんが、どなたか解決方法（下記以外の書き方でもかまいません）を教えて頂けませんでしょうか。 よろしくお願いいたします。 ---<googlemap.tpl>------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Google Maps JavaScript API Example - simple</title> </head> <script src="http://maps.google.com/maps?file=api&v=2.x&key=GOOGLEAPIKEY type="text/javascript" charset="UTF-8"></script> <body onload="load();showAddress('{$event_location}')"> <div id="map" style="width:450px; height:400px"></div> <script type="text/javascript"> var map = null; var geocoder = null; function load() { if (GBrowserIsCompatible()) { map = new GMap2(document.getElementById("map")); map.addControl( new GSmallMapControl() ); geocoder = new GClientGeocoder(); } } function showAddress(address) { if (geocoder) { geocoder.getLatLng( address, function(point) { if (!point) { alert(address + " not found"); } else { map.setCenter(point, 13); var marker = new GMarker(point); map.addOverlay(marker); marker.openInfoWindowHtml(address); } } ); } } </script> <div id="map" style="width:500px; height:600px"></div> </body> </html>
- ベストアンサー
- PHP
- javascriptでgooglemapを出力していますが、firef
javascriptでgooglemapを出力していますが、firefoxで表示されません。 他のサーバで使用していた際はfirefoxでも問題なく表示できていました。何が問題でしょうか。 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title/> <script src="http://maps.google.com/maps?file=api&v=2&key=xxxxx" type="text/javascript"/> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(35.573027,xxx.xxxxxxxxx), 17); map.addControl(new GMapTypeControl()); map.addControl(new GLargeMapControl()); map.enableScrollWheelZoom(); } } //]]> </script> </head> <body onload="load()" onunload="GUnload()"> <div id="map" style="width: 450px; height: 300px;"/> </body> </html>
- ベストアンサー
- JavaScript
- Google maps API のマーカーを増やす
お恥ずかしながらJavascriptが全く分からない者です。 しかし、必要が生じ、いじっていますが、 下記のソースで、マーカーの個数を増やす場合、 何処のソースをどのように増やせばいいのでしょうか？ また、その他やり方がありましたら、 ご教授いただければと思い、 質問させていただきました。 よろしくお願いいたします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "?http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">? <html xmlns="?http://www.w3.org/1999/xhtml">? <head> <title>テスト</title> <link href="../../css/css.css" rel="stylesheet" type="text/css" /> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <script src="?http://maps.google.com/maps?file=api&v=2&key=?＊＊＊＊" type="text/javascript"></script> </head> <body> <h1>テスト</h1> <div id="map" style="width: 500px; height: 300px"></div> <script type="text/javascript"> //<![CDATA[ if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); map.addControl(new GLargeMapControl()); var point = new GLatLng(35.852766, 139.794382); map.setCenter(point, 16); var marker = new GMarker(point); map.addOverlay(marker); GEvent.addListener(map, 'click', function(overlay, point) { if (overlay) { overlay.openInfoWindow( document.createTextNode("テスト")); } }); } //]]> </script> </body> </html>
- ベストアンサー
- HTML
お礼
すごくよくわかりました！！ ありがとうございます。 あとは何とか自分で頑張ってみます。 もしも またわからない所が出ましたら是非お願いします。＞＜