2011-03-19 31 views
0

私が絶対的な初心者であるため、私は自分がどこにいるかを悩ませました。しかし、私はそれをやった。そして、私はもっと幸せになれませんでした!しかし...私には最後の最後の問題があります。Smarty&Google Maps APIを使用したJavascript

私はSmartyを使用しています。 Smartyは地図のマーカーを読み込むための動的javascriptを作成します。

ヘッダーとフッターの.tplファイルを含める必要があります。私のheader.tplは<head><body>ですが、私のマップコードは<head><body>の位置にあります。

コードの一部が問題です。

私はこの「オンロード」コードなしでジャバスクリプトを実行する方法を絶対に理解できません。誰かが私にヒントを与えることができますか?

私が本当に必要とするのは、<body>タグに依存しないでJavaScriptコードを起動する方法を知ることです。

ここに私のコードがありますので、事前に大変ありがとうございます!

{* 

{include file="header.tpl"} 
<h3 class="titlehdr">Book Buyers - Accounts Map</h3> 
{if $userlevel == 5} 
    <p>Admin User</p> 
{/if} 
Hello, {$name}! 
<br><br> 

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
    html { height: 50% } 
    body { height: 50%; margin: 0px; padding: 0px } 
    #map_canvas { height: 50% } 
</style> 
*} 



<br><br> 

<script type="text/javascript" 
    src="http://maps.google.com/maps/api/js?sensor=false"> 
</script> 
<script type="text/javascript"> 
{foreach from=$getMap key=k item=v} 
    var buyer{$k} = new google.maps.LatLng 
    {foreach from=$v key=k item=latlng} 
     {if $k == "lat"} 
      ({$latlng} , 
     {else} 
      {$latlng}); 
     {/if} 
    {/foreach} 
{/foreach} 

var marker; 
var map; 

function initialize() { 
    var mapOptions = { 
    zoom: 5, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    center: warehouse 
    }; 

    map = new google.maps.Map(document.getElementById("map_canvas"), 
     mapOptions); 

    marker = new google.maps.Marker({ 
    map:map, 
    draggable:false, 
    animation: google.maps.Animation.DROP, 
    position: buyer5 
    }); 
{foreach from=$getMap key=k item=v} 
    marker{$k} = new google.maps.Marker({ 
    map:map, 
    draggable:false, 
    animation: google.maps.Animation.DROP, 
    position: buyer{$k} 
    }); 
{/foreach} 

} 

</script> 

<body onload="initialize()"> 
    <div id="map_canvas" style="width:70%; height:70%"></div> 


{include file="footer.tpl"} 

答えて

0

あなたはjQueryを使って、あなたがする必要があるすべては<script></script>タグでそのコードを呼び出していることを行うことができます。ドキュメントがブラウザに読み込まれ、準備ができたらコードを呼び出す方法は次のとおりです。

<script type="text/javascript"> 
    $(document).ready(function(){ 

     //Your code supposed to be called, goes here. 

    }); 
</script> 

<script>タグは、文書のどの部分に書いていても動作しますが、あなたは「偉大な」のブラウザを使用している場合、あなたは;-)私が何を意味するか知っています。しかし、これは互換性の問題になる可能性があるので、ページ上の任意の場所にこれらのタグを持つ良い習慣ではありません。だからあなたのページの<head></head>タグ内のコードを保持します。

JQueryの場合、最新の安定版をWebサイトからダウンロードするか、<head>タグに次の行を追加するだけです。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
関連する問題