필드가 동적으로 채워 졌는지 확인하는 방법은 무엇입니까?

Question

출발지와 목적지 사이의 고정 가격을 보여주는 Google지도 계산기를 만들었습니다.

하지만 가격은지도를 입력하거나 div를 클릭 한 후에 만 ​​표시됩니다.

$(document).ready(function(){ 

    function initMap() { 
    var latlng = new google.maps.LatLng(52.379189, 4.899431); 
    var mapOptions = { 
     center: latlng, 
     zoom: 11, 
     mapTypeControl: false, 
     streetViewControl: false, 
     styles: [{"featureType":"water","stylers":[{"saturation":43},{"lightness":-11},{"hue":"#0088ff"}]},{"featureType":"road","elementType":"geometry.fill","stylers":[{"hue":"#ff0000"},{"saturation":-100},{"lightness":99}]},{"featureType":"road","elementType":"geometry.stroke","stylers":[{"color":"#808080"},{"lightness":54}]},{"featureType":"landscape.man_made","elementType":"geometry.fill","stylers":[{"color":"#ece2d9"}]},{"featureType":"poi.park","elementType":"geometry.fill","stylers":[{"color":"#ccdca1"}]},{"featureType":"road","elementType":"labels.text.fill","stylers":[{"color":"#767676"}]},{"featureType":"road","elementType":"labels.text.stroke","stylers":[{"color":"#ffffff"}]},{"featureType":"poi","stylers":[{"visibility":"off"}]},{"featureType":"landscape.natural","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"color":"#b8cb93"}]},{"featureType":"poi.park","stylers":[{"visibility":"on"}]},{"featureType":"poi.sports_complex","stylers":[{"visibility":"on"}]},{"featureType":"poi.medical","stylers":[{"visibility":"on"}]},{"featureType":"poi.business","stylers":[{"visibility":"simplified"}]}] 
     }; 
     map = new google.maps.Map(document.getElementById('map'), mapOptions); 
    } 

    function drivingRoute(from, to) { 
    var request = { 
     origin: from, 
     destination: to, 
     travelMode: google.maps.DirectionsTravelMode.DRIVING, 
     unitSystem: google.maps.UnitSystem.METRIC 
    }; 
    if(typeof(drivingLine) !== 'undefined') drivingLine.setMap(null); 
    directionsService.route(request, function(response, status){ 
     if(status == google.maps.DirectionsStatus.OK){ 

     var totalKM = Math.round(response.routes[0].legs[0].distance.value/1000); 
     var distanceText = totalKM+' km'; 
     $('#controls p').text(distanceText); 

     var stadsdeelTest = document.getElementById('stadsdeel').value; 
     if (stadsdeelTest=='Centrum') { 
        var charges= '€ '+ 32; 
      } 
     else if (stadsdeelTest=='Amsterdam-Oost') { 
        var charges= '€ '+ 35; 
      } 
     else if (stadsdeelTest=='Oud-Zuid') { 
        var charges= '€ '+ 30; 
      } 

     $('#controls h2').text(charges); 

     drivingLine = new google.maps.Polyline({ 
      path: response.routes[0].overview_path, 
      strokeColor: "#b00", 
      strokeOpacity: .75, 
      strokeWeight: 5 
     }); 
     drivingLine.setMap(map); 
     map.fitBounds(response.routes[0].bounds); 

     } 

     else { 
     $('#controls p').addClass('error'); 
     } 

    }); 

    } 

    $('input').blur(function(){ 
    drivingRoute(
     $('input[name=from]').val(), 
     $('input[name=to]').val() 
    ); 
    }); 

    $(function(){ 
     $("#geocomplete").geocomplete({ 
      details: "form", 
      types: ["address"], 
      country: 'nl' 
     }); 

     $('input').blur(function(){ 
      $("#geocomplete").trigger("geocode"); 
     }); 
     }); 


    var map; 
    var drivingLine; 
    var directionsService = new google.maps.DirectionsService(); 
    initMap(); 
    $('input[name=to]').val('Schiphol'); 
    $('input[name=from]').trigger('blur'); 
}); 

// Autocomplete 
     var fromText = document.getElementById('geocomplete'); 
     var cityBounds = new google.maps.LatLngBounds(
     new google.maps.LatLng(52.379189, 4.899431)); 
     var options = { 
      bounds: cityBounds,    
      types: ['geocode'], 
      componentRestrictions: {country: 'nl'} 
     }; 

    // google.maps.event.addListener(autocomplete, 'place_changed', function() { 
    // window.alert("you selected an item from suggestion list"); 
    // }); 

    $("input").change(function() { 
    document.getElementById("bestemming").focus(); 
      return false; 
}); 

document.getElementById('geocomplete').onkeypress = function (e) { 
     if (e.which === 13) { 
      document.getElementById("bestemming").focus(); 
      return false; 
     } 
    }; 

예 : http://codepen.io/anon/pen/rMEdKO/

봅니다 출발 필드에 "Damrak, 암스테르담, 네덜란드"를 넣어지도를 클릭합니다. 그것은 sublocality Centrum의 가격을 보여줍니다.

"Ceintuurbaan, Amsterdam, Nederland"로 목적지를 변경 한 후에는지도를 클릭 한 후에 가격이 변경되지 않습니다.

대상을 채우고 사용자가 목적지를 변경하면 가격을 표시하고 싶습니다. 가격은 자동으로 변경되어야합니다. 대신이 당신 질문/문제에 응답하면 blur 이벤트가 당신의 input

//This is what you have 
    $('input').blur(function(){ 
    drivingRoute(
     $('input[name=from]').val(), 
     $('input[name=to]').val() 
    ); 
    }); 


    //Remove/modify the code above and try this 
    $('#geocomplete').bind('input', function() { 
     drivingRoute(
      $('input[name=from]').val(), 
      $('input[name=to]').val() 
     ); 
    }); 

완전히 확실하지 않음에 change 이벤트를 시도 얻을 사용

Answer 1

.