javascriptを使用して外部のHTMLページからdivをロードする方法は？

マップと呼ばれるdivの1つにGoogleマップのhtmlページがあります。javascriptを使用して外部のHTMLページからdivをロードする方法は？

var map = new google.maps.Map(document.getElementById('map'),mapOptions);

今、複数のウェブページで同じGoogleマップを使用したいと考えています。他のページでこのdivをどのように参照するのですか？

私はこのような別のHTMLファイル

<html><head></head> 
<body><div><!--How do I get the map here--></div> 
</body></html>

はそれがjQueryのを使用してかのうですか？

---編集----

だから私は順番に

var map = new google.maps.Map(document.getElementById('map'),mapOptions);

を持って

jQuery(document).ready(function(){

を持ってmyscript.js というスクリプトを持っていますだから、どこにでもこのスクリプトをロードするにはどうすればいいですか？

出典

2012-01-10 Anonymous

ライブサンプルがありますか？ありがとう。 – andresf

あなたはこの部門を参照しません。マップは、ページがロードされるとオンザフライで生成されます。

$('#element').load('map.html #map)を使用すると、読み込まれたコンテンツからすべてのスクリプトがストライプされるため、生成スクリプトは実行できません。

同じマップであるはずなので、jQuery.getScript（）を使用してみてください。

// gmaps.js 
function generateMap() { 
    //your custom logic 
} 

// html file 
<html><head></head> 
<body><div id="gmap"></div> 
<script> 
$.getScript('gmaps.js', function() { 
    // Call custom function defined in script 
    generateMap(); 
}); 

</script> 
</body></html>

またjQuery.getScript()を使用してのstackoverflowのとGoogleマップ上で、ここでの例を見て可能性があります

0123を

EDIT - 更新例

// map.js 
function generateMap() 
{ 
    map = new GMap2(document.getElementById("div_map")); 
    map.addControl(new GSmallMapControl()); 
    map.addControl(new GMapTypeControl()); 
    var latLong = new GLatLng(parseFloat(52.2322549), parseFloat(21.0387957)); 
    var marker = new GMarker(latLong, {draggable : false}); 
    map.addOverlay(marker); 
    map.setCenter(latLong, 15); 
} 


// map.html - ! CHANGE API KEY ! 
<html> 
    <head> 
     <title>Google Map sample</title> 
     <script type="text/javascript" src="js/jquery-1.7.1-min.js"></script> 
     <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=PUT_YOUR_KEY_HERE&sensor=false" type="text/javascript"></script> 
    </head> 
<body> 
<div id="div_map" style="width:500px;height:400px;background-color:red;"></div> 
<script type="text/javascript"> 
$.getScript('map.js', function() { 
    generateMap(); 
}); 
</script> 
</body> 
</html>

出典

2012-01-10 18:33:27 BartekR

あなたはちょっと確認してください。 –

あなたの完全なjavascriptファイルはどのように見えますか？マップの生成にのみ機能します。私は例を更新しました – BartekR

は、あなたが実際に他のページにマップインスタンス自体を複製するために見ていないことを仮定すると、私はあなたがして経由で参照することができ、スタンドアロンページを作成することをお勧め。あなたはjQuery経由で試してみることもできますが、地図が破損する可能性があります。

出典

2012-01-10 18:35:36 andresf

javascriptを使用して外部のHTMLページからdivをロードする方法は？

答えて

関連する問題