0

私はJavaScriptにかなり慣れていないので、優しくしてください;）

私は Google Maps API V3 を使用しており、この例に従ってカスタム コントロールを作成しています。Googleの例なので、かなり簡単です。私が問題を抱えているのは、.innerHTML を JavaScript を含む既存の DIV に置き換えることです。

最終的に、Google マップ上に Google Adsense 広告を含むカスタム コントロールを作成しようとしています。通常、HTML の body タグの後に div を作成し、そこに Google Adsense 広告の JavaScript コードを含めます。

通常、私は controlText.innerHTML = 'いくつかの html がここに入る'; を使用します。カスタムコントロール用ですが、私の場合は、Google Adsense 広告の JavaScript コードを含む既存の DIV を使用したいと考えています。

交換してみました

controlText.innerHTML = 'some html goes here';

と

controlText.innerHTML = document.getElementById("verticalad");

しかし、それはマップを壊すだけです。誰かが私が間違っていることを提案できますか? かなり簡単に修正できることを願っています。

    <!DOCTYPE html>
    <html>
    <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Google Maps JavaScript API v3 Example: Custom Controls</title>
    <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script>

    var map;
    var chicago = new google.maps.LatLng(41.850033, -87.6500523);
    function HomeControl(controlDiv, map) {

    controlDiv.style.padding = '4px';

    var controlUI = document.createElement('div');
    controlUI.style.backgroundColor = 'white';
    controlUI.style.borderStyle = 'solid';
    controlUI.style.borderWidth = '2px';
    controlUI.style.cursor = 'pointer';
    controlUI.style.textAlign = 'center';
    controlUI.title = 'Click to set the map to Home';
    controlDiv.appendChild(controlUI);

    var controlText = document.createElement('div');
    controlText.style.fontFamily = 'Arial,sans-serif';
    controlText.style.fontSize = '12px';
    controlText.style.paddingLeft = '4px';
    controlText.style.paddingRight = '4px';

    //**********************************************************************//
    //Normally this would be controlText.innerHTML = 'some html goes here';
    //**********************************************************************//
    controlText.innerHTML = document.getElementById("verticalad");

    controlUI.appendChild(controlText);

    google.maps.event.addDomListener(controlUI, 'click', function() {
    map.setCenter(chicago)
    });

    }

    function initialize() {
    var mapDiv = document.getElementById('map_canvas');
    var mapOptions = {
    zoom: 12,
    center: chicago,
    mapTypeId: google.maps.MapTypeId.TERRAIN,
    streetViewControl: false,
    mapTypeControl: true,
    mapTypeControlOptions: {

    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
    position: google.maps.ControlPosition.RIGHT_BOTTOM

    }

    }
    map = new google.maps.Map(mapDiv, mapOptions);

    var homeControlDiv = document.createElement('div');
    var homeControl = new HomeControl(homeControlDiv, map);

    homeControlDiv.index = 1;
    map.controls[google.maps.ControlPosition.LEFT_CENTER].push(homeControlDiv);
    }

    </script>
    </head>
    <body onload="initialize()">
    <div id="map_canvas" style="width:100%;height:700px;"></div>

    //****************************************************************
    // This is the div that needs to be in the custom control
    //****************************************************************
    <div id="verticalad"><script type="text/javascript">adsense code goes here</script></div>
    </body>
    </html>
4

2 に答える 2

0

これを機能させることができたので、どこかにセミコロンが欠けていたと思います..

実際、HTML の Body の div に Adsense コードをそのまま残してから、controlText.innerHTML = document.getElementById("verticalad").innerHTML; を使用しました。

AdSense 広告が IE に表示されないという問題はまだありましたが、IE7 をエミュレートするよう強制するメタ タグを配置したところ、現在は正常に動作しています。現在、このサイトは最新のすべてのブラウザーで問題なく表示されるはずです。

最終的なサイトに興味がある人は、http://www.flighttracker.gleff.comにアクセスしてください。

助けてくれてありがとう。

ジェフ

于 2012-08-01T13:23:29.340 に答える
0

verticalad div 全体をコントロールに移動するか、verticalad のコンテンツだけを移動しますか? 移動したい場合は、appendChild代わりに使用しますinnerHTML

controlText.appendChild(document.getElementById("verticalad"));

コンテンツが必要な場合は、verticalad の innerHTML を使用します

controlText.innerHTML = document.getElementById("verticalad").innerHTML;
于 2012-07-25T13:50:47.277 に答える