0

设置

  • 我的课程页面上有多个链接location_link
  • 每个 Linksrel属性都等于一个城市状态组合（即Omaha, NE）
  • 页面加载后，JavaScript 函数会循环遍历所有项目并使用 jQuery 将事件location_link 绑定到它们。click
  • 此点击事件触发对 Fancybox 构造函数的调用，该构造函数应该显示与链接关联的位置的 Google 地图

问题：

每当我单击“位置链接”之一时，都会收到以下错误消息：

无法加载请求的内容。请稍后再试。

我已经写的代码： 

function setUpLocationLinks() {
    locationLinks = $("a.location_link");
    locationLinks.click(
        function() {
            var me = $(this);
            console.log(me.attr("href"));
            $.fancybox(
                {
                    "showCloseButton" : true,
                    "hideOnContentClick" : true,
                    "titlePosition"  : "inside",
                    "title" : me.attr("rel"),
                    "type" : "image"
                }
            )
            return false;
        }
    );
}

我已经完成的研究：

注意：Google 静态地图 API 不再需要地图 API 密钥！（Google Maps API Premier 客户应改为使用将发送给您的新加密密钥签署他们的 URL。有关详细信息，请参阅 Premier 文档。）

  • 我正在使用的图像 URL确实解析并拉回了我需要的数据
  • 当我将上述 URL 放入标准 <img> 标记时，地图显示得很好。
  • 我想实现这一点，而不必创建某种我不断切换src属性的虚拟 <img> 标记。

希望这些信息对您有所帮助。如果您有任何其他问题，请告诉我。

4

1 回答 1

1

这就是我想出的。它使用一个空的 <img> 标签，但它可以工作。我很想看到有人想出一个更优雅的解决方案。

function setUpLocationLinks() {
    var locationLinks = $("a.location_link");
    var mapImage = $("#map_image");
    var mapImageContainer = $("#map_image_container");
    var mapFancybox = function() {
        $.fancybox.hideActivity();
        $.fancybox(
            {
                "showCloseButton" : true,
                "hideOnContentClick" : true,
                "titlePosition"  : "inside",
                "content" : mapImageContainer.html()
            }
        );
    }
    locationLinks.click(
        function() {
            var clickedLink = $(this);
            $.fancybox.showActivity();
            mapImage.attr("src", clickedLink.attr("href")).load(
                function() {
                    mapFancybox();
                }
            );
            if(mapImage.complete) {
                mapImage.triggerHandler("load");
            }
            return false;
        }
    );
}
于 2010-04-05T00:07:56.113 回答