如何触发特定HTML元素的某些事件?

时间:2016-02-12 15:48:33

标签: javascript angularjs events angular-google-maps

我希望在HTLM元素发生任何变化时触发事件,以下事件将在浏览器大小更改时触发, google.maps.event.trigger($scope.map, 'test');我希望它适用于HTML元素 IndiaMap 这是以下html元素的ID ),当这个HTML的大小时,如何触发此HTML的事件元素改变了。

<div ng-style="{ 'width' : width + '%' , 'height': height + '%' }" id="IndiaMap">
        <ui-gmap-google-map center='map.center' zoom='map.zoom' control='map.control' id="map-canvas" events="map.events">
            <ui-gmap-markers models="markers" idkey="markers.id" coords="'coords'"  events="markerEvents" icon="'icon'" fit="true">                 
            </ui-gmap-markers>
        </ui-gmap-google-map>
</div>

 var input = document.getElementById('pac-input');
 var searchBox = new google.maps.places.SearchBox(input);       
 google.maps.event.addListener(searchBox, 'places_changed', function() {    
    var places = searchBox.getPlaces();  
    var marker_search = {   
      id:store_index,
      coords: {
        latitude: places[0].geometry.location.lat(),
        longitude: places[0].geometry.location.lng()
      },

    $scope.latitude=marker_search.latitude;
    $scope.longitude=marker_search.longitude;      
    $scope.map.center = {latitude: marker_search.latitude, longitude: marker_search.longitude};
    $scope.map.zoom=17;
    google.maps.event.trigger($scope.map, 'test');
    $scope.$apply();
})

google.maps.event.addDomListener(window, "test", function() {                
    $scope.map_obj.setCenter($scope.center); 
});

1 个答案:

答案 0 :(得分:0)

这是纯粹的javascript,我无法发表评论所以我不知道怎么问你是否可以。

<div id = "IndiaMap">asdasd</div>
<script>
var refIndia = document.getElementById('IndiaMap');
var oldId = refIndia.innerHTML; //save old innerHTML

setInterval(Check, 1000); //you can play with the duration of this timer

function Check(){
    var currentId = refIndia.innerHTML;
    if(currentId !== oldId){ //compare between now and then
        alert("InnerHTML changed!");
        oldId = currentId; //reset so next time the timer runs, there will be another comparing to do
    }

}
</script>

这是一个计时器,你可以根据需要使用计时器的发生。 尝试将其实现到您的代码中。