2

我已经添加了 markerwithlabel.js 文件，并且可以使用以下代码在我的谷歌地图上成功显示带有标签的标记：

markerArray[i] = new MarkerWithLabel({
 position: myLatLng,
 map: map,
 icon: image,
                 labelAnchor: new google.maps.Point(25, 30),
                 labelClass: "marker_labels", // the CSS class for the label
                 labelStyle: {opacity: 0.75},
                 labelContent: format_num(property[6]),
 }
);

当我将鼠标悬停在页面上与该标记/标签对应的另一个元素上时，我想更改标签的类以突出显示它。我尝试过使用 jQuery，但无法正常工作：

$(".sidelisting").hover(
             function () {
                 $(markerArray[this.id].labelClass).addClass("hovered");
             },
             function () {
                 $(markerArray[this.id].labelClass).removeClass("hovered");
             }
     );

上面的代码在控制台中没有显示任何 javascript 错误，但鼠标悬停时没有任何反应，将其从 更改labelClass为label也不起作用，有什么想法吗？

4

1 回答 1

4

首先，您在悬停功能中使用 this.id。为此，具有类的元素sidelisting必须具有与 markerArray 的索引匹配的 id。

其次：如果markerArray[this.id].labelClass不是未定义的，它可能是“marker_labels”而不是 DOMNode。这使得$(markerArray[this.id].labelClass)创建一个空的 jquery 对象或一个引用 ID 为“marker_labels”的元素的 jquery 对象。您必须在标记上调用 set 才能更改任何属性：

$(".sidelisting").hover(
         function () {
             markerArray[this.id].set("labelClass", "marker_labels hovered")
         },
         function () {
             markerArray[this.id].set("labelClass", "marker_labels")
         }
 );
于 2013-05-21T18:05:33.093 回答