2012-08-01 63 views
0

我已經創建了一個簡單的地圖; http://preprod-pnr.terresnouvelles.com/fr/decouvertes/les-hebergements-nature-et-patrimoine如何強制彈出關閉,當我點擊打開另一個?

如果我打開一個鄉間別墅和酒店,彈出窗口保持打開狀態。如果我打開第二個Gîte彈出框,第一個彈出框會自動關閉。

我希望所有彈出窗口都有此行爲。如果我點擊一個項目,另一個彈出關閉本身。

我該怎麼做?

配置變量:

var googlemap_setting = { 
"gite": "http://preprod-pnr.terresnouvelles.com/fr/decouvertes/les-hebergements-nature-et-patrimoine/@@hebergement_kml_view?q=gite", 
"hotel": "http://preprod-pnr.terresnouvelles.com/fr/decouvertes/les-hebergements-nature-et-patrimoine/@@hebergement_kml_view?q=hotel", 
"chambre": "http://preprod-pnr.terresnouvelles.com/fr/decouvertes/les-hebergements-nature-et-patrimoine/@@hebergement_kml_view?q=chambre-hote", 
"camping": "http://preprod-pnr.terresnouvelles.com/fr/decouvertes/les-hebergements-nature-et-patrimoine/@@hebergement_kml_view?q=camping", 
"insolite": "http://preprod-pnr.terresnouvelles.com/fr/decouvertes/les-hebergements-nature-et-patrimoine/@@hebergement_kml_view?q=insolite" 
} 

JavaScript時加載地圖:

$(document).ready(function() { 

function initGoogleMaps() { 
    if ($('#map_canvas').length==0) { 
     return; 
    } 

    var myOptions = { 
     center : new google.maps.LatLng(47.26804151097223, 
       -0.08375246917164172), 
     zoom : 9, 
     mapTypeId : google.maps.MapTypeId.HYBRID 
    }; 

    var map = new google.maps.Map(document 
      .getElementById("map_canvas"), myOptions); 

    var controlDiv = document.createElement('div'); 

    controlDiv.style.padding = '5px'; 

    // Set CSS for the control border. 
    var controlUI = document.createElement('div'); 
    controlUI.style.backgroundColor = 'white'; 
    controlUI.style.borderStyle = 'solid'; 
    controlUI.style.borderWidth = '1px'; 
    controlUI.style.cursor = 'pointer'; 
    controlUI.style.textAlign = 'center'; 
    controlUI.title = 'Filtrer'; 
    controlDiv.appendChild(controlUI); 

    // Set CSS for the control interior. 
    var controlText = document.createElement('div'); 
    controlText.style.fontFamily = 'Arial,sans-serif'; 
    controlText.style.fontSize = '12px'; 
    controlText.style.paddingLeft = '4px'; 
    controlText.style.paddingRight = '4px'; 
    controlText.innerHTML = $('#mapscontrol').html(); 
    $('#mapscontrol').remove(); 
    controlUI.appendChild(controlText); 

    var camping = new google.maps.KmlLayer(
      googlemap_setting["camping"]); 
    var gite = new google.maps.KmlLayer(
      googlemap_setting["gite"]); 
    var chambre = new google.maps.KmlLayer(
      googlemap_setting["chambre"]); 
    var hotel = new google.maps.KmlLayer(
      googlemap_setting["hotel"]); 
    var insolite = new google.maps.KmlLayer(
      googlemap_setting["insolite"]); 

    camping.setMap(map); 
    gite.setMap(map); 
    chambre.setMap(map); 
    hotel.setMap(map); 
    insolite.setMap(map); 

    google.maps.event.addDomListener(controlDiv, 'click', 
      function(event) { 
       var item = event.srcElement; 
       if (item.checked) { 
        if (item.value == "camping") { 
         camping.setMap(map); 
        } 
        if (item.value == "gite") { 
         gite.setMap(map); 
        } 
        if (item.value == "chambre") { 
         chambre.setMap(map); 
        } 
        if (item.value == "hotel") { 
         hotel.setMap(map); 
        } 
        if (item.value == "insolite") { 
         insolite.setMap(map); 
        } 
       } 
       if (!item.checked) { 
        if (item.value == "camping") { 
         camping.setMap(null); 
        } 
        if (item.value == "gite") { 
         gite.setMap(null); 
        } 
        if (item.value == "chambre") { 
         chambre.setMap(null); 
        } 
        if (item.value == "hotel") { 
         hotel.setMap(null); 
        } 
        if (item.value == "insolite") { 
         insolite.setMap(null); 
        } 
       } 
      }); 

    map.controls[google.maps.ControlPosition.TOP_RIGHT] 
      .push(controlDiv); 
} 
function initDataTable(){ 
    datatableconfig = { 
      "iDisplayLength" : 20, 
      "aaSorting": [[2, "asc"]], 
      "oLanguage": {"sUrl": "@@collective.js.datatables.translation"}, 
      "aLengthMenu" : [ [ 20, 30, 50, -1 ], 
        [ 20, 30, 50, "Tous" ] ] 
     }; 

    var oTable = $('#table-hebergement').dataTable(
      datatableconfig); 

    /* ADD COLUMN SEARCH SUPPORT */ 
    $('#table-hebergement #head-type select').change(
      function(eventObject) { 
       oTable.fnFilter($(this).val(), 0); 
      }); 
    $('#table-hebergement #head-capacity select').change(
      function(eventObject) { 
       oTable.fnFilter($(this).val(), 1); 
      }); 

} 
initGoogleMaps(); 
initDataTable(); 
}); 
+0

從控制檯看到你的代碼真的很煩人。你能發佈特定於你的問題的代碼嗎? – 2012-08-01 08:24:30

+0

請張貼一些代碼。 – 2012-08-01 08:38:44

+0

我認爲這甚至是無禮的,你已經最小化了你鏈接到的網站上的代碼。 – 2012-08-01 08:40:43

回答

1

很難提出什麼不看你的代碼,但我只想補充一類的outer-彈出窗口的大部分元素,例如.popup,然後我會嘗試在打開一個元素之前關閉所有的元素。在jQuery中說:

$(".popup").hide(); 
相關問題