关于将jquery加载到特定div中

时间:2013-05-19 13:26:45

标签: javascript jquery google-maps

有人可以帮我解决这个问题吗?

在我的Rails项目中(我认为它不重要的是什么项目)我有一个固定位置的标题,称为“fixed_header”。此页面上有链接,点击后会在下面加载新页面。

其中一个加载的页面在点击时会有一个名为“map_canvas”的div。我希望我的'fixed_header'页面中的代码检查是否存在名为'map_canvas'的div,然后,如果它存在,则将地图加载到其中。

我的代码摘自我的整个应用程序中的代码段,但是我无法让它适用于这个特定的东西。任何帮助将不胜感激。

<script>

  //Is 'ready' the code to use? This code is in 'fixed_header'
  //My idea is that, once 
  //a link in 'fixed_header' is clicked, a new page loads
  //underneath the header. The div 'map_canvas' is
  //searched for and the function activates if it is found.

    $(document).on("ready", function () {

        if ($("#map_canvas").length > 0) {

            initialize_google_maps();

        }

    });

    function initialize_google_maps() {

        var currentlatlng = new google.maps.LatLng(user_latitude, user_longitude);
        var zoom = 10;
        var myOptions = {
            zoom: zoom,
            center: currentlatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP, // ROADMAP, SATELLITE, HYBRID
            streetViewControl: false
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        var marker = new google.maps.Marker({
            map: map,
            position: currentlatlng,
            icon: {
                oppacity: 0
            }
        });

        var circle = new google.maps.Circle({
            map: map,
            fillOpacity: 0,
            strokeWeight: 2,
            strokeOpacity: 0.7,
            radius: 10000,
        });
        circle.bindTo('center', marker, 'position');
    }
</script>

1 个答案:

答案 0 :(得分:0)

因为您想在用户点击链接时实时检查div存在,您应该更改代码

$(document).on("ready", function () {

        if ($("#map_canvas").length > 0) {

            initialize_google_maps();

        }

    });

如下

$('a').live('click',function() {
        if ($("#map_canvas").length > 0) {

            initialize_google_maps();

        }
}

根据您的链接类或ID使用锚点选择器。