Tabing中的google map如果我们再次回到Tab，则删除搜索栏

Question

我正在将google map与百度map一起使用。当我们单击指定它们名称的按钮时，它们两者都通过ajax请求。当我单击百度地图并返回到Google地图搜索字段时，第一次出现的Google地图带有搜索框。如果我尝试追加或克隆搜索字段，则搜索字段停止工作。 我正在使用的代码：

function initMap() {
    //   var locations = '<?php echo $location ?>'';
    var icon = '<?= IMG_URL; ?>location.png';

    var newarr = Array();
        map = new google.maps.Map(document.getElementById('map'),{
        zoom: 4,
        minZoom: 3,
        maxZoom: 20,
        center: {lat: 4.0633, lng: 102.2164},
        mapTypeId: 'roadmap',
        gestureHandling: 'greedy'
    });


    var infowindow = new google.maps.InfoWindow();

    markers = locations.map(function(location, i) {
    markers1 = new google.maps.Marker({
        position: location,
        id: location['id'],
        html: location['html'],
        icon : icon,
        map: map
    });
        google.maps.event.addListener(markers1, 'click', function() {
            infowindow.setContent(this.html);
            infowindow.open(map, this);
        });
        return markers1;
    });
    if (typeof google === 'object' && typeof google.maps === 'object') {
       //alert("load");
        $('#check').html('load');
    }else{
        //alert("unload");
       $('#check').html('unload');
    }
    var mcOptions = {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m', gridSize: 40, maxZoom: 20, zoomOnClick: false, minimumClusterSize: 2};

    // Add a marker clusterer to manage the markers.
    var markerCluster = new MarkerClusterer(map, markers, mcOptions);

    //console.log(markerCluster);
    google.maps.event.addListener(markerCluster, 'clusterclick', function(cluster){

        var clMarkers = cluster.getMarkers();
        var newarr = Array();
        clMarkers.forEach(function(element) {
            newarr.push(element.id);
        });


        $.ajax({ 
            url: 'property_scroll.php',
            data: {"id": newarr},
            type: 'post',
            success: function(result){
                //alert(result);
                $("#show_property").html(result);
            }              
        });
    });

    // Create the search box and link it to the UI element.
    var input = document.getElementById('pac-input');
    //var input = '<input id="pac-input" class="form-control controls" placeholder="Enter Keyword" type="text">';
    //var input = /** @type {HTMLInputElement} */(document.getElementById('pac-input').clone());
    var searchBox = new google.maps.places.SearchBox(input);
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

    // Bias the SearchBox results towards current map's viewport.
    map.addListener('bounds_changed', function() {
      searchBox.setBounds(map.getBounds());
    });

     markers = [];
    // Listen for the event fired when the user selects a prediction and retrieve
    // more details for that place.
    searchBox.addListener('places_changed', function() {
      var places = searchBox.getPlaces();

      if (places.length == 0) {
        return;
      }
      // Clear out the old markers.
    /*  markers.forEach(function(marker) {
        marker.setMap(null);
      });*/
      markers = [];

      // For each place, get the icon, name and location.
      var bounds = new google.maps.LatLngBounds();
      places.forEach(function(place) {
        if (!place.geometry) {
          console.log("Returned place contains no geometry");
          return;
        }
        var icon = {
          url: place.icon,
          size: new google.maps.Size(71, 71),
          origin: new google.maps.Point(0, 0),
          anchor: new google.maps.Point(17, 34),
          scaledSize: new google.maps.Size(25, 25)
        };

        // Create a marker for each place.
       /* markers.push(new google.maps.Marker({
          map: map,
          icon: icon,
          title: place.name,
          position: place.geometry.location
        }));*/

        if (place.geometry.viewport) {
          // Only geocodes have viewport.
          bounds.union(place.geometry.viewport);
        } else {
          bounds.extend(place.geometry.location);
        }
      });
      map.fitBounds(bounds);
    });
}