在Google Map中更改信息窗口的內容

我正在使用Google地圖v3 API。在Google Map中更改信息窗口的內容

我搜索一些實體，然後根據位置將標記放置在地圖上。現在每個標記都有自己的信息窗口，如姓名，年齡，地點和一個選擇按鈕。點擊選擇按鈕選擇用戶，按鈕被禁用，文本變成使用jQuery「選擇」。但是當我再次打開該信息窗口時，其'選擇'按鈕。因爲用戶可以選擇多個用戶，所以再次推入標記以擺脫此問題對我來說不是一種選擇。我無法在飛行中更改按鈕的類別，因此我不必再次打擾後端放置新標記。

我使用車把模板生成信息窗口內容的標記的細節，我推到了信息窗口：

<script id="search-user" type="text/x-handlebars-template"> 
{ldelim}{ldelim}#user{rdelim}{rdelim} 
<table border = '1' align = 'center'> 
    <tr> 
     <td rowspan='4' align='center'> 
      <img id="selected-umpire-image-{ldelim}{ldelim}userId{rdelim}{rdelim}" 
       src='{$userImageKey}' border='1'> 
     </td> 
    </tr> 
    <tr width='200'> 
     <td align='left'> 
      <strong> 
       <a href='#' id="selected-umpire-name-{ldelim}{ldelim}userId{rdelim}{rdelim}" 
        title="{ldelim}{ldelim}userName{rdelim}{rdelim}"> 
        {ldelim}{ldelim}truncatedName{rdelim}{rdelim} 
       </a> 
      </strong>, 
      <span id="selected-umpire-city-{ldelim}{ldelim}userId{rdelim}{rdelim}" 
       title="{ldelim}{ldelim}city{rdelim}{rdelim}"> 
       {ldelim}{ldelim}truncatedCity{rdelim}{rdelim} 
      </span> 
     </td> 
    </tr> 
    <tr> 
     <td align='left' id="selected-umpire-ageGender-{ldelim}{ldelim}userId{rdelim}{rdelim}" 
      attr-gender="{ldelim}{ldelim}gender{rdelim}{rdelim}" attr-age="{ldelim}{ldelim}dateOfBirth{rdelim}{rdelim}"> 
      {ldelim}{ldelim}gender{rdelim}{rdelim}, {ldelim}{ldelim}dateOfBirth{rdelim}{rdelim} years 
     </td> 
    </tr> 
    <tr> 
     <td align='left' id="selected-umpire-active-{ldelim}{ldelim}userId{rdelim}{rdelim}"> 
      Active as {ldelim}{ldelim}activeRolesString{rdelim}{rdelim} . 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <a href='#'> 
       &nbsp; 
      </a> 
     </td> 
     <td align='center'> 
      <button type="button" id="select-{ldelim}{ldelim}userId{rdelim}{rdelim}" 
       onclick="javascript:createMatch.selectUmpire(this)" rel="0" 
      {ldelim}{ldelim}#selected{rdelim}{rdelim} 
       class="approve-button greenhover disabled-button select-entity" disabled=""> 
      {ldelim}{ldelim}/selected{rdelim}{rdelim} 
      {ldelim}{ldelim}^selected{rdelim}{rdelim} 
       class="approve-button greenhover"> 
      {ldelim}{ldelim}/selected{rdelim}{rdelim} 

       <span class="bt-text"> 
        {ldelim}{ldelim}#selected{rdelim}{rdelim} 
         Selected 
        {ldelim}{ldelim}/selected{rdelim}{rdelim} 
        {ldelim}{ldelim}^selected{rdelim}{rdelim} 
         Select 
        {ldelim}{ldelim}/selected{rdelim}{rdelim} 
       </span> 
      </button> 
     </td> 
    </tr> 
</table> 
{ldelim}{ldelim}/user{rdelim}{rdelim}

來源

2014-01-16 user2619058

你的代碼是什麼樣的？ – geocodezip

如果用戶已經被選中，則選擇的是true，按鈕將被禁用 – user2619058

selectUmpire（）是做什麼的？ –

在谷歌地圖的所有信息窗口的內容已經被綁定到標記，每當我們打開infoWindow，我們就可以在infoWindow上獲得標記的綁定內容。

在谷歌地圖中，有一個信息窗口的偵聽器已經準備就緒，每次顯示信息窗口時都會調用它。所以我們將綁定聆聽者爲

google.maps.event.addListener(infoWindow, 'domready', function() { 
    checkSelect(entityID); // EntityID here is the id of the user 
});

因此，當打開infoWindow時，函數checkSelect將被調用。

而checkSelect函數將檢查傳遞的ID是否存在於散列中。如果它存在，那麼該用戶被選中，然後使當前infoWindow的選擇按鈕被禁用。我創建了一個虛擬示例。你可以看到在 http://jsfiddle.net/prabhat_rai/zpx7qfh5/

來源

2014-10-18 05:59:45

在Google Map中更改信息窗口的內容

回答

相關問題