无法在动态生成的div中显示Google Map

时间:2012-05-18 04:49:54

标签: c# javascript jquery pagemethods

我试图在div中显示Google Map,该div是通过对C#程序的PageMethod调用创建的。 Pagemethod返回生成的html代码,该代码使用jquery命令$('。showitems')插入到我的网页中.html(somecode);此代码包含一个div,我想在其中放置一张Google地图但是当我执行我的javascript来创建Google地图时,它会用空格替换div,而不是地图。但是,如果我硬编码包含地图的div,则用于创建Google地图的javascript可以正常工作。所以我的问题是,为什么我不能使用动态生成的HTML代码创建Google地图?以下是我创建Google地图的代码,除了动态生成的div之外,该地图已经使用了多年。

function ShowDinerItems(dinerkey) {

            document.getElementById('HiddenDinerID').value = dinerkey;
            var latitude = document.getElementById("Hiddenlat").value;
            var longitude = document.getElementById("Hiddenlng").value;
            location = document.getElementById("LocationText").textContent;

            PageMethods.CallShowDinerItems(dinerkey, latitude, longitude, location, OnShowDinerComplete, OnShowDinerError, dinerkey);
        }

    function OnShowDinerComplete(result, dinerkey) {


              $('.showitems').html(result[0]);
              }

上面列出的showitems区域有一个跨区域,用于点击以获取地图,如下所示:

<span style="cursor:pointer" onclick=\"DisplayDinerMap('40.0912345', '89.12345', `'m0001', 'diner name')\">  Map </span>`

<div id="m0001" style="height:200px; width:200px;display:inline">map</div>

动态生成的div map在showitems div中如下所示,其中“m001”是map1“的id。

function markDiner(lat, lng, content, map1) {

            map = new google.maps.Map(document.getElementById(map1), {
                zoom: 14,
                center: new google.maps.LatLng(lat, lng),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(lat, lng),
                map: map,
                animation: google.maps.Animation.DROP,
                title: content
            });

        }

用户点击地图链接后调用Map功能。在调试模式中,我可以看到执行通过Map例程。

 function DisplayDinerMap(lat, lng, map1, dinername) {

            markDiner(lat, lng, dinername, map1);
}

如果map1是硬编码的,Google地图可以运行。如果它是通过调用PageMethod动态生成的,则它不显示地图,而是在我编码的文字上显示空格,以查看它是否消失。所以在上面的例子中,当我尝试显示地图时,文本“map”消失了。任何建议或意见都表示赞赏。

1 个答案:

答案 0 :(得分:0)

尝试向您用于触发事件的范围添加委派。