JavaScript가 다음 IF 문으로 넘어 가지 않음

점수가 0 인 첫 번째 문장 이후에 내 프로그램이 if 문으로 이동하지 않는 이유를 알 수 없습니다. 제가 첫 번째 도시를 찾으면 두 번째 if 문은 시작되지 않습니다. 두 번째 도시를 찾아야한다는 경보 창을 띄웁니다. score = 1 인 if 문이 활성화되지 않는 이유가 확실하지 않습니다. window.alert 문은 프로그램 실행을 정지하기 때문에 당신이 그것을 해제 할 때까지JavaScript가 다음 IF 문으로 넘어 가지 않음

<!DOCTYPE html> 
<html> 

<body> 

<div id="map" style="width:100%;height:500px"></div> 

<script> 

var map; 
     var score; 
     score = 0; 
     function initMap() { 
     var chicago = {lat: 41.8781, lng: -87.6298}; 
     var indianapolis = {lat: 39.7684, lng: -86.1581}; 
     var oklahomaCity = {lat: 35.4819, lng: -97.5084}; 
     map = new google.maps.Map(document.getElementById('map'), { 
      center: {lat: 0.0, lng: 0.0}, 
      zoom: 1 
}); 
     var chicagoMarker = new google.maps.Marker({ 
      position: chicago, 


}); 

     var oklahomaCityMarker = new google.maps.Marker({ 
      position: oklahomaCity, 
}); 

     var indianapolisMarker = new google.maps.Marker({ 
      position: indianapolis, 

}); 

if (score==0) { 
    chicagoMarker.setMap(map); 
    chicagoMarker.setVisible(false); 
    window.alert("Find my first city!"); 
    map.addListener('bounds_changed',function(){ 
     zoom = map.getZoom(); 
     console.log(zoom); 
     if (zoom ==2 && map.getBounds().contains(chicagoMarker.getPosition())){ 
      window.alert("Good Start!"); 
     } 
     if (zoom ==3 && map.getBounds().contains(chicagoMarker.getPosition())){ 
      window.alert("Keep Going!"); 
     } 
     if (zoom ==4 && map.getBounds().contains(chicagoMarker.getPosition())){ 
      window.alert("Getting Closer!"); 
     } 
     if (zoom ==5 && map.getBounds().contains(chicagoMarker.getPosition())){ 
      window.alert("Closer!"); 
     } 
     if (zoom ==6 && map.getBounds().contains(chicagoMarker.getPosition())){ 
      window.alert("Keep Going!"); 
     } 
     if (zoom ==7 && map.getBounds().contains(chicagoMarker.getPosition())){ 
      window.alert("Almost There!"); 
     } 
     if (zoom ==8 && map.getBounds().contains(chicagoMarker.getPosition())){ 
      window.alert("You found Chicago! Your Score is: 1"); 
      score = 1; 
     } 
    }) 
}; 


if (score==1) { 
    oklahomaCityMarker.setMap(map) 
    oklahomaCityMarker.setVisible(false); 
    window.alert("Find my second city!"); 
    map.addListener('bounds_changed',function(){ 
     zoom = map.getZoom(); 
     console.log(zoom); 
     if (zoom ==2 && map.getBounds().contains(oklahomaCityMarker.getPosition())){ 
      window.alert("Good Start!"); 
     } 
     if (zoom ==3 && map.getBounds().contains(oklahomaCityMarker.getPosition())){ 
      window.alert("Keep Going!"); 
     } 
     if (zoom ==4 && map.getBounds().contains(oklahomaCityMarker.getPosition())){ 
      window.alert("Getting Closer!"); 
     } 
     if (zoom ==5 && map.getBounds().contains(oklahomaCityMarker.getPosition())){ 
      window.alert("Closer!"); 
     } 
     if (zoom ==6 && map.getBounds().contains(oklahomaCityMarker.getPosition())){ 
      window.alert("Keep Going!"); 
     } 
     if (zoom ==7 && map.getBounds().contains(oklahomaCityMarker.getPosition())){ 
      window.alert("Almost There!"); 
     } 
     if (zoom ==8 && map.getBounds().contains(oklahomaCityMarker.getPosition())){ 
      window.alert("You found Chicago! Your Score is: 1"); 
      google.maps.event.ClearListeners('bounds_changed'); 
     } 
    }) 
    score = score + 1; 
    google.maps.event.ClearListeners('bounds_changed'); 

}; 

if (score==2) { 
    indianapolisMarker.setMap(map) 
    indianapolisMarker.setVisible(false); 
    window.alert("Find my first city!"); 
    map.addListener('bounds_changed',function(){ 
     zoom = map.getZoom(); 
     console.log(zoom); 
     if (zoom ==2 && map.getBounds().contains(indianapolisMarker.getPosition())){ 
      window.alert("Good Start!"); 
     } 
     if (zoom ==3 && map.getBounds().contains(indianapolisMarker.getPosition())){ 
      window.alert("Keep Going!"); 
     } 
     if (zoom ==4 && map.getBounds().contains(indianapolisMarker.getPosition())){ 
      window.alert("Getting Closer!"); 
     } 
     if (zoom ==5 && map.getBounds().contains(indianapolisMarker.getPosition())){ 
      window.alert("Closer!"); 
     } 
     if (zoom ==6 && map.getBounds().contains(indianapolisMarker.getPosition())){ 
      window.alert("Keep Going!"); 
     } 
     if (zoom ==7 && map.getBounds().contains(indianapolisMarker.getPosition())){ 
      window.alert("Almost There!"); 
     } 
     if (zoom ==8 && map.getBounds().contains(indianapolisMarker.getPosition())){ 
      window.alert("You found Chicago! Your Score is: 2"); 
     } 
    }) 
    score = score + 1; 
    google.maps.event.ClearListeners('bounds_changed'); 

}; 
    } 
</script> 
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCuvsCAF0gVmwv6AF0SoA3xBjV66RG4r7o&callback=initMap" 
    async defer></script> 
</body> 
</html>

출처

2016-11-11 Nate

2K 줄의 코드 5K는 왜 필요합니까? – Teemu

하드 코어 경고 코드 =) –

'map.getBounds(). contains (chicagoMarker.getPosition())'을 한 번 호출하지 않으시겠습니까? 결과를 저장 하시겠습니까? –

그것은 다음 if로 이동하지 않습니다. 예를 들어 jQuery-ui dialog 또는 Bootstrap-ui modals과 같이 차단하지 않는 팝업 구성 요소를 사용하는 것이 좋습니다.

출처

2016-11-11 11:35:53

다음 경고문으로 넘어갈 수 있도록 경고를 닫을 수있는 방법이 있습니까? – Nate

아니요, 사용자 만이를 닫을 수 있습니다. 내 대답을 업데이트했습니다. 코드 실행이 멈추지 않는 다른 알림 시스템을 사용해보십시오. –

그래서 사용자가 코드를 닫을 때에도 코드는 다음 문장으로 넘어갈 수 없습니다. – Nate

JavaScript가 다음 IF 문으로 넘어 가지 않음

답변

관련 문제