【问题标题】:Hightlight sidebar block on marker click在标记单击时突出显示侧边栏块
【发布时间】:2012-04-10 10:28:13
【问题描述】:

我当前的谷歌地图代码工作到如果我点击侧边栏链接,会触发标记事件,然后打开信息窗口。单击标记时,我需要做什么才能突出显示侧边栏上的块??

function createMarkers(point, username, st) {
    var html = '<b>' + username + '</b> <br/> ' + st;

    var marker = new google.maps.Marker({
        position: point, 
        map: map, 
        //zIndex: Math.round(point.lat()*-100000)<<5,
        title: username
    });

    //Closes any open infowindow while clicking on another marker
    infowindow = new google.maps.InfoWindow();
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.close();
        infowindow.setContent(html);
        infowindow.open(map, marker);
    });

    markersArray.push(marker);

    return marker;
}

在创建标记时,我还创建了侧边栏条目:

sidebar.innerHTML += '<span id="sidebarTxt">'
                                     +'<a href="javascript:sidebar_click(' + i + ')">' 
                                     + '<b>' + name + '</b> </a> <br/> ' 
                                     + 'St: ' + st + '<br />' 
                                     + 'St Preference: ' + location + '<br />' 
                                     + 'Distance from me: ' + Number(distance).toFixed(2) + 'miles <br />' 
                                     +' </span>';

单击标记时,我需要做什么才能突出显示侧边栏上的块??

【问题讨论】:

    标签: javascript jquery google-maps-api-3 google-maps-markers


    【解决方案1】:

    像这样修改click监听器:

     google.maps.event.addListener(marker, 'click', function() {
        infowindow.close();
        infowindow.setContent(html);
        infowindow.open(map, marker);
        $("#sidebarTxt").toggleClass("new_style"); // this line adds the new_style to  sidebarTxt span
    });
    

    哪里有点风格

    .new_style {
        border: 1px solid red;
    }
    

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-05-27
    • 1970-01-01
    相关资源
    最近更新 更多